在React Native Redux中更新状态后的空白屏幕

时间:2017-02-07 08:11:47

标签: reactjs react-native redux react-redux

第一次渲染时我得到Home组件,但是当我在componentDidMount中更改状态时,HomeComponent再次导航HomeComponent,然后转到空白页面。它与_renderScene逻辑无关。

如果我只是{_ 1}}在_renderScene中,它仍会在return <Home>

之后给我一个空白屏幕
componentDidMount()

当我更改homeNav import { actions as navActions } from 'react-native-navigation-redux-helpers'; class HomeContainer extends Component { _renderScene(sceneProps) { return <Home /> } componentDidMount() { this.props.dispatch(navActions.jumpTo(1, "main")) // Works when // this.props.dispatch(navActions.jumpTo(1, "home") // Here I change the state of homeNavigation. } render() { return ( <NavigationCardStack navigationState={this.props.homeNav} renderScene={this._renderScene.bind(this)} /> ); } } function mapStateToProps(state) { return { mainNav: state.mainNavigation, homeNav: state.homeNavigation }; } 的状态时,它有效,  但是当我第一次渲染this.props.dispatch(navActions.jumpTo(1, "home"))后我在上面的代码中更改mainNav然后再次导航并进入空白屏幕时。

1 个答案:

答案 0 :(得分:0)

如您的代码中所述,当您在componentDidMount()方法中调度操作时,如:

this.props.dispatch(navActions.jumpTo(1, "main"))

然后你的mapStateToProps()方法只接收mainNav prop和homeNav在此更新时有nil或空值。收到mainNav后,你的render()方法正在执行,你在渲染中传递的homeNav当前为空或空白:

<NavigationCardStack
        navigationState={this.props.homeNav}
        renderScene={this._renderScene.bind(this)}
      />

值为空白或为零,它不会重定向到您的主页组件并显示空白屏幕。在这种情况下你应该使用mainNav,或者也应该使用homeNav传递mainNav。谢谢!