javascript–TabNavigator中的React Navigation传递道具

概述我有在初始屏幕上从服务器加载的道具.我想将它们传递给其他选项卡屏幕.但是,我没有在网上找到任何例子.我知道screenProps,但不知道如何设置它.我尝试过的所有方法都导致了错误.constEProj=TabNavigator({Home:{screen:HomeScreen},Map:{screen:MapG},Login:

我有在初始屏幕上从服务器加载的道具.我想将它们传递给其他选项卡屏幕.但是,我没有在网上找到任何例子.我知道screenProps,但不知道如何设置它.我尝试过的所有方法都导致了错误.

const EProj = TabNavigator({  Home: { screen: HomeScreen },  Map: { screen: MapG },  Login: { screen: Login },  Profile: { screen: Profile },}, {  tabbarposition: 'bottom',  animationEnabled: true,  tabbarOptions: {    activeTintcolor: '#1abc9c',  },});

这是我的屏幕设置.我应该在哪里放置screenProps？

<EProj  screenProps={cats}/>

如何设置它的任何好例子都会有所帮助.提前致谢.

HomeScreen设置：

class HomeScreen extends React.Component {  static navigationoptions = {    tabbarLabel: 'Home',  };...  componentwillMount(){    console.log("Starting to load assets from server!");    this.onLoadCats(); /*starts asset loading*/  }  render() {    return (      <VIEw style={styles.container}>        <Text>Welcome to Alpha 1.17 This is hard system test.</Text>        <AssetsLoad catsL={this.state.catsL} />      </VIEw>    );  }}

解决方法:

你可以做的是创建一个可以返回导航的高阶组件,在该组件的componentDIDMount中,你可以加载数据并通过screenProps传递它.

例

const EProj = TabNavigator({  Home: { screen: HomeScreen },  Map: { screen: MapG },  Login: { screen: Login },  Profile: { screen: Profile },}, {  tabbarposition: 'bottom',  animationEnabled: true,  tabbarOptions: {    activeTintcolor: '#1abc9c',  },});class MainNavigation extends React.Component {  constructor(props) {    super(props);    this.state = {cats: []};  }  componentDIDMount() {    this.onLoadCats().then((cats) => this.setState({ cats: cats }));  }  render() {    return(<EProj screenProps={{ cats: this.state.cats}} />  }}// Now you can do in your screensconsole.log(this.props.screenProps.cats);/* This is next line is wrong, please check update above */ /* console.log(this.props.navigation.state.params.cats); */

总结

以上是内存溢出为你收集整理的javascript – TabNavigator中的React Navigation传递道具全部内容，希望文章能够帮你解决javascript – TabNavigator中的React Navigation传递道具所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。