使用React Native Router Flux和Tabbar保留最后一个场景

时间:2017-06-07 00:28:47

标签: react-native redux react-native-router-flux

我有以下场景,我使用带有3个链接的Tabbar。如果我导航到我的子场景,单击另一个Tabbar链接,然后返回并单击我的孩子所在的Tabbar链接,它将返回到根场景。流程将显示我离开的最后一个场景(子场景)而不是根。我试过在" initial" param一旦我的场景活跃,但这没有任何作用。它正确记录,但它仍然是根目录。我正在使用Redux Persist来保存我的状态,这在其他方面工作正常。有关如何解决这个问题的想法吗?

Routes.js:

const mapStateToProps = (state) => ({
  hidden: state.boolean.hidden
})

const mapDispatchToProps = (dispatch) => bindActionCreators({resetLoader}, dispatch)

class App extends React.Component {

  constructor(props) {
    super(props)
    this.parentFunction = this.parentFunction.bind(this)
  }

  parentFunction(){
    this.props.resetLoader()
    Alert.alert(JSON.stringify(this.props.hidden))<-----Alerts "true" boolean value
  }

render() {
  return (
    <Router>
      <Scene key="root">
        <Scene
          key="tabbar"
          tabs={true}
          initial={true}
          tabBarStyle={{ backgroundColor: '#FFFFFF' }}
        >
          {/* scenes */}
          <Scene key="a" title="A" iconName="tags" icon={TabIcon}>
            <Scene
              key="pageOne"
              component={PageOne}
              hideBackImage
              title="pageOne"
            />
            <Scene
              key="pageContainer"
              component={PageContainer}
              navBar={Header}
              functionToPass={this.parentFunction}
              initial = { this.props.hidden }                  
            />
           ...

PageContainer.js:

class PageContainer extends Component {

    constructor(props) {
    super(props);
  }

  componentDidMount() {
    this.props.functionToPass(); <-----Pass function back to parent to dispatch and change state
  }

booleanReducer.js:

const boolean = (state={hidden: false}, action) => {
switch (action.type) {
    case "RESET_VALUE": {
      return {
        ...state,
        hidden: true
      }
    }
   }
    return state
}
export default boolean;

booleanActions.js:

export const resetLoader = () => {
  return {
    type: 'RESET_VALUE'
  }
}

0 个答案:

没有答案