如何使用react-native-router-flux在模态中进行导航

ale*_*ngn 6 javascript react-native

我需要在我的react-native应用程序中的模态中进行导航

使用新版本react-native-router-flux,似乎不可能这样做.我可以创建一个垂直动画来显示下一个场景,这与在场景顶部有一个模态不同.

    <Scene key="login" direction="vertical">
        <Scene key="loginModal" component={Login} schema="modal" title="Login"/>
        <Scene key="loginModal2" hideNavBar={true} component={Login2} title="Login2"/>
    </Scene>
Run Code Online (Sandbox Code Playgroud)

在我的情况下,我需要我的模态具有透明的颜色背景,所以我将能够看到模态背后的场景.

我这样做的唯一方法是使用<Modal>react-native中的组件并在其中包含导航,但似乎没有办法在中定义类似的东西Router.

我需要的更像是这样的:

{/* LoginModal would be a wrapper which can render children */}
<Scene key="login" component={LoginModal}>
    <Scene key="loginModal" component={Login} title="Login"/>
    <Scene key="loginModal2" hideNavBar={true} component={Login2} title="Login2" panHandlers={null} duration={1}/>
</Scene>
Run Code Online (Sandbox Code Playgroud)

然后,在LoginModal将呈现这样的事情:

render(){
    return (
        <Modal animated={true} transparent={true} visible={true}>
            {/* Render the scene that needs to be rendered,
                including the navigation bar */}
            {this.props.children} 
        </Modal>
    );
Run Code Online (Sandbox Code Playgroud)

有没有办法可以做到这一点?或者您是否知道有更好的方法来为react-native提供类似的路由系统?

谢谢.