在反应导航中，我们如何在堆栈位于抽屉中的位置逐个替换抽屉屏幕?不同的屏幕(本地反应)

Question

成功登录后，我将移动到此抽屉。

const SalesRepDrawerNavigation = () => {
return (
<SalesRepDrawerNavigator.Navigator initialRouteName="SalesRepDashboardStack">
<SalesRepDrawerNavigator.Screen
name="SalesRepDashboardStack"
component={SalesRepDashboardStackNavigation}
options={{
headerTitle: 'Sales Rep Dashboard'
}}
/>
<SalesRepDrawerNavigator.Screen
name="Customers"
component={CustomerListScreen}
/>
<SalesRepDrawerNavigator.Screen
name="SalesOrderView"
component={SalesOrderStackNavigation}
options={{

}}
/>
</SalesRepDrawerNavigator.Navigator>
);
};
const SalesRepDashboardStackNavigation = () => {
return (
<SalesRepDashboardStackNavigator.Navigator key="test" headerMode="none" initialRouteName="SalesRepDashboard">
<SalesRepDashboardStackNavigator.Screen
name="SalesRepDashboard"
component={SalesRepDashboardScreen}
/>
<SalesRepDashboardStackNavigator.Screen
name="CreateSalesOrder"
component={CreateSalesOrderScreen}
/>
</SalesRepDashboardStackNavigator.Navigator>
);
};

然后当我转到客户列表屏幕并选择一个我想移动的客户以创建销售订单屏幕，同时想删除客户列表路线时。我将react native与react navigation v5结合使用。

我该怎么做？

Answer 1

像使用一样使用它

在DrawerData组件中，您必须创建一个抽屉项目列表(一个自定义组件(，对于屏幕之间的导航，通常使用navigation.anavigation('YOUR_SCREEN_NAME'(；

仅在Stack.Navigator中添加所有屏幕。抽屉将只有主屏幕。

/*Drawer data is custom drawer item list*/

export function DrawerNav() {
return (
<Drawer.Navigator drawerContent={props => <DrawerData {...props} />}>
<Drawer.Screen name="Home" component={HomeScreen} />
</Drawer.Navigator>
);
}

const RootStackScreen = () => { 

return (
<Stack.Navigator>
<>
<Stack.Screen
name="HomeScreen"
component={DrawerNav}
/>
<Stack.Screen
name="FirstScreen"
component={FirstScreen}
/>

<Stack.Screen
name="SecondScreen"
component={SecondScreen}
/>
</Stack.Navigator>
);

}