Question

我想在React-Native应用程序上使用DrawerLayoutAndroid模块。为了以编程方式使用openDrawer，我使用useRef挂钩。

运行此方法时，我的抽屉仅显示黑色的“溢出”，而不显示导航。

如果我向右滑动，将显示Drawler菜单：/

我的代码：

const Layout = ({ children }) => {
  let drawler = useRef(null);

  return (
    <DrawerLayoutAndroid
      drawerWidth={300}
      drawerPosition={DrawerLayoutAndroid.positions.Left}
      ref={drawler}
      renderNavigationView={() => (
        <View style={{ flex: 1, backgroundColor: '#fff' }}>
          <Text style={{ margin: 10, fontSize: 15, textAlign: 'left' }}>
            I'm in the Drawer!
          </Text>
        </View>
      )}>
      <View style={{ flex: 1 }}>
        <ScrollView>
          <View style={styles.container}>
            <Button onPress={() => drawler.current.openDrawer()}> // Show only overflow, not the menu
              Open drawler
            </Button>
            {children}
          </View>
        </ScrollView>
      </View>
    </DrawerLayoutAndroid>
  );
};

有人可以帮助我吗？

Answer 1

我通过useCallback解决了这个问题

const [drawer, setDrawer] = useState();
const refDrawer = useCallback(element => {
    setDrawer(element);
}, []);

不要忘记为DrawerLayoutAndroid组件设置ref={refDrawer}属性。

DrawerLayoutAndroid不使用openDrawer方法显示菜单

1 个答案: