Question

抽屉导航器（reactnavigation v2）是否可以不更改屏幕而是改为redux状态？

示例：

api = [{id: 1, name: 'Pippo'}, {id: 2, name: 'Pluto'}, {id: 3, name: 'Paperino'}]

抽屉

Menu title 1
Menu title 2
Menu title 3

屏幕

Welcome **state.name**

单击元素1-> actionChangeName（element_1）->状态名称='pippo'

 Screen -> Welcome Pippo

单击元素2-> actionChangeName（element_2）->状态名称='pluto'

 Screen -> Welcome Pluto

单击元素3-> actionChangeName（element_3）->状态名称='paperino'

 Screen -> Welcome Paperino

谢谢

Answer 1

我解决了我的问题：

我创建了一个只包含一个包含“ Welcome ** state.name **”的屏幕和一个名为 DrawerMenu

createDrawerNavigator({ main: WelcomeScreen }, { contentComponent: DrawerMenu })

DrawerMenu（示例）：

class DrawerMenu extends Component {
  render() {
    return (
      <View style={styles.container}>
        <View style={styles.titleContainer}>
          <Text style={styles.title}> Drawer Menu </Text>
        </View>
        <ScrollView>
          {this._renderList()}
        </ScrollView>
      </View>
    );
  }

  _renderList = () => this.props.list.map(element => (
    <TouchableOpacity key={element.id} onPress={this._updateElementSelected(element.id)}>
      <Text>Menu title {element.id}</Text>
    </TouchableOpacity>
  );

  _updateElementSelected = (elementId) => () => {
    this.props.actionSetElementSelected(elementId, this.props.list);
    this.props.navigation.toggleDrawer();
  };
}

ReactNative-带Redux的抽屉导航器

1 个答案: