React native 如何从导航器外部调用导航器?

React native 如何从导航器外部调用导航器?,react-native,React Native,我的应用程序中有一个选项卡栏,我不希望每次渲染新路线时导航转换都会受到影响。因此,我想将选项卡栏放在导航器之外,但是在这种情况下,如何触发导航操作呢?我无法从导航器外部访问传递给renderScene函数的导航器对象 以下是app.js中返回的内容: <View> <Navigator ref="navigator" initialRoute=

我的应用程序中有一个选项卡栏,我不希望每次渲染新路线时导航转换都会受到影响。因此,我想将选项卡栏放在导航器之外,但是在这种情况下,如何触发导航操作呢?我无法从导航器外部访问传递给renderScene函数的导航器对象

以下是app.js中返回的内容:

            <View>
                <Navigator
                    ref="navigator"
                    initialRoute={{name: "start"}}
                    renderScene={this.renderScene.bind(this)}
                    configureScene={this.configureScene.bind(this)}
                />
                <TabBar navigator={???} style={styles.nav} />
            </View>

我认为这不是做你想做的事情的最佳方式。但要回答你的问题:

            <View>
                <Navigator
                    ref="navigator"
                    initialRoute={{name: "start"}}
                    renderScene={this.renderScene.bind(this)}
                    configureScene={this.configureScene.bind(this)}
                />
                <TabBar getNavigator={()=>this.refs.navigator} style={styles.nav} />
            </View>

this.refs.navigator}style={styles.nav}/>

然后您可以从选项卡栏调用
getNavigator()
好的,我想我解决了这个问题。问题似乎是在组件的第一次渲染时参照不可用。我通过以下方式解决了这个问题:

<Navigator
    ref={(r) => { this.navigatorRef = r; }}
    initialRoute={{name: "start"}}
    renderScene={this.renderScene.bind(this)}
    configureScene={this.configureScene.bind(this)}
/>
{this.state ? <TabBar navigator={this.state.navigatorRef} style={styles.nav} /> : null }

只需使用TabBar再次渲染组件。

这是另一个适合我的版本。这是一个黑客程序,将来可能会中断,但如果您赶时间,可能会有所帮助;)


{this.navigation=r}}
/>

navigator在TabBar中仍然未定义,您知道为什么吗?请尝试在TabBar组件中记录
this.props.navigator
,这就是我所做的,未定义there@theva这里有另一种方法。
componentDidMount() {
    this.setState({navigatorRef: this.navigatorRef});
}