React native 抽屉未从左向右改变位置

我正试着把抽屉从左移到右，但不起作用。然而，当我尝试从右向左移动时，它工作正常。我已经在物理设备上试过，并在模拟器上运行过，但都没用

这是我的package.json：

{
  "name": "Practice",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/core": "^5.10.0",
    "@react-navigation/drawer": "^5.8.2",
    "@react-navigation/native": "^5.5.1",
    "react": "16.11.0",
    "react-native": "0.62.2",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-reanimated": "^1.9.0",
    "react-native-safe-area-context": "^3.0.5",
    "react-native-screens": "^2.8.0"
  },
  "devDependencies": {
    "@babel/core": "^7.10.2",
    "@babel/runtime": "^7.10.2",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.0.1",
    "eslint": "^7.2.0",
    "jest": "^26.0.1",
    "metro-react-native-babel-preset": "^0.59.0",
    "react-test-renderer": "16.11.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

节点版本：v10.19.0 NPM版本：6.14.5

代码：

import React，{Component}来自'React'；
从“react native”导入{按钮、视图、文本}；
从'@react navigation/drawer'导入{createDrawerNavigator，DrawerItem}；
从'@react-navigation/native'导入{NavigationContainer}；
函数主屏幕（{导航，路由：{参数：{changePosition}}}）{
返回(
navigation.toggleDrawer（）}
title=“打开抽屉”
/>
);
}
const Drawer=createDrawerNavigator（）；
导出默认类应用程序扩展组件{
状态={
位置：'左'
}
changePosition（）{
this.setState（{position:this.state.position==='right'？'left'：'right'}，（）=>{
警报（“抽屉位置：+本状态位置”）；
});
}
render（）{
返回(
);
}
}

截图

我已将此问题提交给GitHub repo，请在此处跟踪：

---

React Navigation v5[position“Right”]（）示例我想更改位置，不想将其固定到右侧您可以使用状态管理“Left”或“Right”更改位置来更改它们是的，但它不起作用请参见此片段：我不知道为什么，但在开发过程中更改位置时会出现一些问题。尝试更改drawerPosition=“right”并重新加载它为我工作的应用程序。如果您动态地从左向右更改它，它将不起作用。

import React, {Component} from 'react';
import { Button, View, Text } from 'react-native';
import {createDrawerNavigator, DrawerItem} from '@react-navigation/drawer';
import { NavigationContainer } from '@react-navigation/native';

function HomeScreen({ navigation, route:{params: {changePosition}} }) {
    return (
        <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
            <Button
                onPress={() => navigation.toggleDrawer()}
                title="Open Drawer"
            />
            <View style={{marginTop:20}}/>
            <Button
                onPress={changePosition}
                title={'Change Drawer Position'}
            />
        </View>
    );
}

const Drawer = createDrawerNavigator();

export default class App extends Component {
    state = {
        position: 'left'
    }
    changePosition(){
        this.setState({position: this.state.position==='right'?'left':'right'}, ()=>{
            alert("Drawer Position: " + this.state.position);
        });
    }
    render(){
        return (
            <NavigationContainer>
                <Drawer.Navigator drawerPosition={this.state.position} initialRouteName="Home">
                    <Drawer.Screen name="Home" component={HomeScreen}
                                   initialParams={{changePosition:this.changePosition.bind(this)}} />
                </Drawer.Navigator>
            </NavigationContainer>
        );
    }
}