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

我已使用react-native-drawer创建了抽屉。抽屉查看包含ListView。无论何时单击renderRow方法，都需要在抽屉本身内部显示导航，而不是在Welcome屏幕堆栈的顶部。如何使用react-native-router-flux在react-native-drawer中进行导航

现在：Check the Screenshot here

预计： want to achieve something like this - Multi Level Menu

文件：组件/ welcome.js

render(){ 
    var settingPanel = <Setting closeDrawer={() => { 
    this.drawer.close(); 
    }} /> 
    return(
    <Drawer 
     ref={c => this.drawer = c} 
     type='overlay' 
     content={settingPanel} 
     ...> 
     <Home /> 
    </Drawer> 
); 
}

文件：组件/ setting.js

render(){ 
    return(
    <ListView 
    dataSource={this.state.dataSource} 
    renderRow={this.renderRow.bind(this)} 
    /> 
); 
} 

renderRow (items) { 
    return(
     <View> 
      <Text style={styles.rowText}>{items.name}</Text> 
      <ImageButton onPress={Actions.trans()} img={fb} /> 
     </View> 
    ) 
};

它在Welcome屏幕顶部导航。我需要在抽屉本身上导航。我怎么能做到这一点？

来源

2017-09-01 Balasubramanian

从它的文档here

选项打开抽屉三个选项：

使用开放道具（控制模式）：
```
<Drawer 
    open={true} 
```

使用抽屉编号：

// assuming ref is set up on the drawer as (ref) => this._drawer = ref 
onPress={() => {this._drawer.open()}}

使用上下文

contextTypes = {drawer: React.PropTypes.object} 
// later... 
this.context.drawer.open()

然后导航到使用反应本地路由器通量另一个组件，你可以添加一个TouchableOpacity组件insted的的<home />然后onPress添加actions.home() 和家庭是关键反应原生路由器通量场景组件

来源

2017-09-01 22:51:48

我可以打开和关闭抽屉。这不是问题。 Plz见SS。我如何导航到抽屉内的另一个组件？ – Balasubramanian

使用'TochableOpacity'或任何按钮组件我已更新答案 –

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

回答

相关问题