如何通过ToolbarAndroid显示DrawerLayoutAndroid => onIconClicked?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (18)

我是React native(和React)的新手,我正在玩一些。

我设法添加一个DrawerLayout,可以从屏幕左侧拖动。不过,当我点击我的ToolbarAndroid中的菜单图标时,我想打开它。

提问于
用户回答回答于

你应该像前面提到的那样使用“refs”。为此,对于抽屉组件具有“ref”属性集:

<DrawerLayoutAndroid
   ...
   ref={'DRAWER_REF'}
   ...
/>

然后在你的组件中使用this.refs它来访问它并调用openDrawercloseDrawer在那个ref上:

this.refs['DRAWER_REF'].openDrawer();
用户回答回答于

使用ReactNative示例,你可以这样做:

var DrawerTest = React.createClass({
  openDrawer:function() {
    this.refs['DRAWER'].openDrawer()
  },
  render: function() {
    var navigationView = (
        <View style={{flex: 1, backgroundColor: '#fff'}}>
          <Text style={{margin: 10, fontSize: 15, textAlign: 'left'}}>I'm in the Drawer!</Text>
        </View>
    );
    return (
          <DrawerLayoutAndroid
              drawerWidth={300}
              ref={'DRAWER'}
              drawerPosition={DrawerLayoutAndroid.positions.Left}
              renderNavigationView={() => navigationView}>
            <View style={{flex: 1, alignItems: 'center'}}>
              <Text style={{margin: 10, fontSize: 15, textAlign: 'right'}}>Hello</Text>
              <Text style={{margin: 10, fontSize: 15, textAlign: 'right'}}>World!</Text>
              <TouchableHighlight onPress={this.openDrawer}>
                <Text>{'Open Drawer'}</Text>
              </TouchableHighlight>
            </View>
          </DrawerLayoutAndroid>
    );

  }
});

扫码关注云+社区