Question

我正在使用一个类组件，我想从这里导航到另一个屏幕。但是它说导航是不确定的。我看了看文档，发现需要使用userNavigation This。但我不怎么实际使用它。有人帮忙

export default class ReduxScreen extends Component {
render() {
    return (
        <View>
           <Button block style={{ marginHorizontal: 30, marginTop: 50 }} onPress={() => {
         //I want to add the useNavigation here

            }}>
             <Text style={{ color: '#FFF' }}>Start</Text>
          </Button>
        </View>
    )
}}

Answer 1

如链接文档中所示，您将必须使用import { useNavigation } from '@react-navigation/native'; export default () => { const navigation = useNavigation(); return ( <View> <Button block style={{ marginHorizontal: 30, marginTop: 50 }} onPress={() => navigation.navigate('YourScreenHere')} > <Text style={{ color: '#FFF' }}>Start</Text> </Button> </View> ); };组件才能使用导航钩。

尝试一下

{{1}}

希望这会有所帮助！

Answer 2

在“类组件”中有一个navigation prop可用，因此您可以使用该道具在其他屏幕上导航，而不必像文档中所述使用钩子

this.props.navigation.navigate('YouScreen', {paramsIfAny})

But you have to make sure that navigation prop is available在您的班级组件中，如果可用，则放置console.log，否则上述行将有效，否则您必须遵循此规则。

https://reactnavigation.org/docs/navigating-without-navigation-prop

React Native useNavigation类Component

2 个答案: