【问题标题】:React Native TabNavigator this.props.navigation.state.params is undefinedReact Native TabNavigator this.props.navigation.state.params 未定义
【发布时间】:2018-07-06 09:30:20
【问题描述】:

我正在使用 react native 制作一个 android 应用程序。我想通过 TabNavigator 传递参数,但是 this.props.navigation.state.params 未定义。目前我正在使用:

"react-native": "0.51.0",
"react-navigation": "^1.0.0-beta.22"

示例代码(尽量保留相关的):

这是我的 index.js:

const RootNavigator = TabNavigator({
    Home: { screen: App },
    Design: { screen: ImageDesign }
}

这是主屏幕:

export default class App extends React.Component {

  constructor(props) {
    super(props);

    this.state = { ... }
  }

  static navigationOptions = {
    tabBarVisible: false
  };

  render() {
    const { navigate } = this.props.navigation;

    return (
      <View style={styles.container}>
        <Button title="design image"
                onPress={ () => navigate('Design',{name: 'Jane'}) }/>
      </View>
    );
  }
}

这是设计画面:

export default class ImageDesign extends React.Component {

  constructor(props) {
    super(props);

    this.state = { ... }
  }

  static navigationOptions = {
    tabBarVisible: false
  };

  render() {
    const { params } = this.props.navigation.state;

    return (
      <View>
        <Text>{ params.name }</Text>
      </View>
    );
  }
}

但不幸的是,params 是未定义的,因此会出现“未定义不是对象”错误

我也试过了:

<Button title="design image"
        onPress={ () => navigate('Design', {}, {type: "Navigate", routName:"ImageDesign", params: {name: 'Jane'}}) }/>

但我不确定这种方式是否有效

提前谢谢你!

【问题讨论】:

    标签: android react-native navigator tabnavigator


    【解决方案1】:

    试试this.props.name。参数/道具应该作为道具发送。您不需要像那样访问导航状态。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-03-28
      • 1970-01-01
      • 1970-01-01
      • 2018-11-17
      • 2021-09-15
      • 2016-09-26
      相关资源
      最近更新 更多