javascript - React Native - navigationState.children[3].key "SCENE_2"与另一个 child 冲突

Question

我们的 react-native 应用程序中的当前导航存在问题。我们使用 react-native-router-flux模块。

我们的路由器结构如下所示:

<Router createReducer={this.reducerCreate.bind(this)} getSceneStyle={getSceneStyle}>
    <Scene key="root" hideNavBar={true}>
        <Scene key={PROFILE_TABBAR} hideNavBar={true}>
            <Scene key={PROFILE} hideNavBar={true} component={ProfileContainer}/>
            <Scene key={PROFILE_PASSWORD} hideNavBar={true} component={PasswordContainer}/>
        </Scene>    
        <Scene key="tabbar" hideNavBar={true} component={TabBar} initial={true}>
            <Scene key="tabbar_inner" tabs={true} hideNavBar={true}>
                <Scene key={TAB_1} component={Tab1Container} number={1} title={TAB_1} hideNavBar={true}/>
                <Scene key={TAB_2} component={Tab2Container} number={2} title={TAB_2} hideNavBar={true} />
                <Scene key={TAB_3}  component={Tab3Container} number={3} title={TAB_3} hideNavBar={true} />
            </Scene>                           
        </Scene>
    </Scene>
</Router>

我们使用自己的TabBar，看起来是这样的:

import {Actions, DefaultRenderer} from 'react-native-router-flux';

import TabBar from './bar';

..

export default class extends Component {

    render(){

        const children = this.props.navigationState.children;
        const state = children[0];

        return (
            <View style={styles.container}>            
              <DefaultRenderer
                navigationState={state}
                key={state.key}
                {...state}
                onNavigate={this.props.onNavigate}
              />
              <TabBar />
            </View>
        );

    }

}

TabBar 包含几个按钮。其中之一对个人资料场景有 Action 。像这样:

{()=>Actions[PROFILE_TABBAR]()}

如果我点击配置文件按钮，它只在第一次时有效。当我返回并再次单击配置文件按钮时，出现错误:

navigationState.children[3].key "scene_2_PROFILE_TABBAR"与另一个 child 冲突!

代码有什么问题？我是否错误地使用了 Actions？我还能如何构建我的代码？

Answer 1

试试这个:

Actions.pop()
   setTimeout(()=>{
   Actions[PROFILE_TABBAR]()
})