bottomTabNavigator中的导航道具出现问题

时间:2019-12-05 14:02:47

标签: react-native navigation react-native-android tabnavigator

我正在使用这个

[1, 4]
average is: 2.5
返回中的

。当我使用它来交换底部选项卡导航器中单个选项卡中的两个屏幕时,我正在使用

 <View style={{flex:1}}>
                {this.state.screenSwitch ? (
                   <Screen1/>
                    ) : <Screen2/>}
                    </View>

但是出现这样的错误

未定义不是对象(正在评估'_this2.props.navigation.navigate')

那是什么问题。

2 个答案:

答案 0 :(得分:0)

您能否创建一个用于处理导航的函数并按如下所示调用onPress

import {NavigationActions} from 'react-navigation'; 

constructor(props) {
   super(props);
}

navigateToScreen = (route) => () => {
    const navigateAction = NavigationActions.navigate({
      routeName: route
    });
    this.props.navigation.dispatch(navigateAction);
}


render() {
    ...
    <TouchableOpacity onPress={this.navigateToScreen('Screen3')} ></TouchableOpacity>
    ...
}

答案 1 :(得分:0)

这可能是由于this变量引起的。尝试创建一个名为self的新变量,并将其放在类声明之前,并遵循以下步骤:

... //imports below
import ....

//here put new variable self
let self;
// your class here
export default class YourClass extends Component {
.....
    constructor() {
        //your constructor fooes...
        self = this;
    }
.....
// and then use self instead of this in your code.

....
 <TouchableOpacity onPress={()=> self.props.navigation.navigate('Screen3')}>
....