Javascript LinearGradient和On按可进行导航

因此，我对react native很陌生，并且知道使用onPress和按钮的基本知识，但由于我已将我的按钮更改为下面的LinearGradient代码，我对使用onPress有点迷茫。现在，我只有onPress输出到我的终端，只是为了测试和确保它的工作

最后，我想导航到另一个页面，我假设我将使用一些导航API。不管是谁，我为你的无知道歉，我真的很感谢你的时间！谢谢

我现在把我的密码放在一个我唯一能想到的地方

现在意识到LinearGradient不适用于onPress…我应该如何将该LinearGradient导航到另一个页面

import React, { Component } from 'react';
import { StyleSheet, Text, View, TouchableOpacity, Animated  } from 'react-native';
import { LinearGradient } from 'expo-linear-gradient';

export default class GetStartedButton extends Component {
  
    constructor(props) {
      super(props)
  
      this.fadeAnimation = new Animated.Value(0)
    }
    componentDidMount() {
        Animated.timing(this.fadeAnimation, {
          toValue: 1,
          duration: 5000,
          useNativeDriver: true,      
        }).start()
      }

    render(){
        return(
        <Animated.View style={[styles.container, { opacity: this.fadeAnimation}]}>
            <TouchableOpacity>
            <LinearGradient   
            onPress={() => console.log("clicked")}        
            colors={['#DB004C','#FC008E']}
            style={styles.linearGradient}
            start={{ x: 0, y: 0.5 }}
            end={{ x: 1, y: 0.5 }}
            >
              
                <Text style={styles.text}>
                    Get Started
                </Text>     
                </LinearGradient>
                </TouchableOpacity>
        </Animated.View>
    )
    
}
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
        
    },
    linearGradient: {
        alignItems: 'center',
        justifyContent: 'center',
        borderRadius: 10,
        width: 340,
        padding: 20,
    },

    text: {
        color: 'white',
        fontSize: 20,
        justifyContent: 'center',
    alignItems: 'center',
    }
});

import React，{Component}来自'React'；
从“react native”导入{样式表、文本、视图、TouchableOpacity、动画}；
从“expo linear gradient”导入{LinearGradient}；
导出默认类GetStartedButton扩展组件{
建造师（道具）{
超级（道具）
this.fadeAnimation=新的动画.Value（0）
}
componentDidMount（）{
动画。计时（此。fadeAnimation{
toValue:1，
持续时间：5000，
useNativeDriver：没错，
}).start（）
}
render（）{
返回(
console.log（“单击”）}
颜色={['#DB004C'，'#FC008E']}
style={style.linearGradient}
开始={x:0，y:0.5}
end={x:1，y:0.5}
>
开始
)
}
}
const styles=StyleSheet.create({
容器：{
弹性：1，
对齐项目：“居中”，
为内容辩护：“中心”，
},
线性梯度：{
对齐项目：“居中”，
为内容辩护：“中心”，
边界半径：10，
宽度：340，
填充：20，
},
正文：{
颜色：'白色'，
尺寸：20，
为内容辩护：“中心”，
对齐项目：“居中”，
}
});

关于这个

<LinearGradient
  colors={['#DB004C', '#FC008E']}
  style={styles.linearGradient}
  start={{ x: 0, y: 0.5 }}
  end={{ x: 1, y: 0.5 }}
>
  <TouchableOpacity
    onPress={() => console.log('clicked')}
    style={{ alignItems: 'center', justifyContent: 'center' }}
  >
    <Text style={styles.text}>Get Started</Text>
  </TouchableOpacity>
</LinearGradient>

console.log（'clicked'）}
style={{alignItems:'center'，justifyContent:'center'}
>
开始

LinearGradient

组件没有有意义的

onPress

eventWell。。。所以，如果我想让它打开或直接进入另一个页面，我会怎么做呢？