我有一个StackNavigator
嵌套在一个DrawerNavigator
中。我似乎无法链接到嵌套在StackNavigator
中的屏幕。例如,给定以下导航结构:
export default class Navigator extends Component {
Posts = () => {
const Stack = createStackNavigator()
return (
<Stack.Navigator initialRouteName="Index" headerMode="none">
<Stack.Screen name="Index" component={PostIndexScreen} />
<Stack.Screen name="Show" component={PostShowScreen} />
<Stack.Screen name="New" component={PostNewScreen} />
<Stack.Screen name="Reply" component={PostNewReplyScreen} />
<Stack.Screen name="JustPublished" component={PostPublishedScreen} />
</Stack.Navigator>
)
}
Home = () => {
const Stack = createStackNavigator()
return (
<Stack.Navigator initialRouteName="Home" headerMode="none">
<Stack.Screen name="Home" component={HomeScreen} />
<Stack.Screen name="Posts" component={this.Posts} />
<Stack.Screen name="Settings" component={SettingsScreen} />
</Stack.Navigator>
)
}
render = () => {
const Main = createDrawerNavigator()
return <NavigationContainer linking={{
prefixes: ["myapp://"],
config: {
screens: {
Home: {
path: "",
screens: {
Posts: "posts",
},
},
},
}
}}>
<Main.Navigator
drawerStyle={{ width: 0 }}
initialRouteName={"Home"}
>
<Main.Screen name="Home" component={this.Home} />
</Main.Navigator>
</NavigationContainer>
}
}
下面的链接将带您进入Home
中的Posts
屏幕:
Linking.openURL("myapp://posts")
我已经试过设置一个非空的路径名为Home
,并做一些类似Linking.openURL("myapp://home/posts")
的事情,但没有用。
我能让它工作的唯一方法是把所有的Post
屏幕都放在Home
的同一水平上,就在DrawerNavigator
的内部。这已经是一个快速修复,但实际的应用程序结构需要我从安装在DrawerNavigator
上的Home
旁边的几个其他屏幕导航到Posts
部分,并且能够goBack()
到上述屏幕,所以顶级的Posts
屏幕并不完全削减它。
我想要的结构基本上是这样的:
- Home
-- FeaturedArticle
-- Comments
-- Comment
-- ArticlesList
-- Article
-- Comments
-- Comment
1条答案
按热度按时间knsnq2tg1#
在这里,我附上我的代码片段,以便您可以有一个想法,以存档这件事在您的情况下