React Navigation - this.props.navigation.state is undefined



使用:"@反应导航/抽屉":"^5.4.0","@react navigation/nature":"^5.1.4",

App.js:

import { createDrawerNavigator } from '@react-navigation/drawer';
...
const Drawer = createDrawerNavigator();
const DrawerRender = () => {
return (
<NavigationContainer>
<Drawer.Navigator drawerContent={props => <DrawerContent {...props} />}>
<Drawer.Screen name="Home" component={Home} />
<Drawer.Screen name="Screen1" component={Screen1} options={{unmountOnBlur: true, gestureEnabled: false}} />
<Drawer.Screen name="Screen2" component={Screen2} options={{unmountOnBlur: true, gestureEnabled: false}} />
</Drawer.Navigator>
</NavigationContainer>
);}

来自屏幕1:

navigateToPage = page_id => {
this.closeCommentScreen();
this.reopenModal = true;
this.props.navigation.navigate('Screen2', {'page_id': 'testing'});
}

在屏幕2上:

export default class Screen2 extends React.Component {
constructor(props) {
super(props);
}
componentDidMount() {
let id = this.props.navigation.state.params.page_id
...

我尝试打印"this.props.navigation",但它总是返回空字典{},因此params是未定义的。

我做错了什么?

它是this.props.route.params

请参阅升级指南https://reactnavigation.org/docs/upgrading-from-4.x#separate-航路道具

第一屏幕

nav.setOptions({
headerRight: () => <Button
title='Add coin'
onPress={() => navigation.navigate('Crypto Information', {
params: { currentCoins: temp },
})}
>
</Button>,
});

第二屏幕

const CryptoInformation = ({ _, route }) => {
const { params } = route.params

最新更新