我正在开发一个教育应用程序,如果用户点击一个主题,它应该指向该主题的章节屏幕。我为此使用堆栈导航,但它似乎不起作用。
这是 App.js:
import * as React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import Constants from 'expo-constants';
import WelcomeScreen from './screens/WelcomeScreen';
import HomeScreen from './screens/HomeScreen';
import {createAppContainer,createSwitchNavigator} from 'react-navigation';
import {AppStackNavigator} from './components/AppStackNavigator';
export default class App extends React.Component{
render(){
return(
<View>
<AppContainer/>
</View>
)
}
}
const switchNavigator = createSwitchNavigator({
WelcomeScreen:{screen:WelcomeScreen},
HomeScreen:{screen:AppStackNavigator}
})
const AppContainer = createAppContainer(switchNavigator)
这是堆栈导航器:
import React,{Component} from 'react';
import {createStackNavigator} from 'react-navigation-stack';
import SelectChapters1 from '../screens/Comprehension/SelectChapters1';
import SelectChapters2 from '../screens/Drama/SelectChapters2';
import SelectChapters3 from '../screens/History/SelectChapters3';
import SelectChapters4 from '../screens/Music/SelectChapters4';
import SelectChapters5 from '../screens/Poetry/SelectChapters5';
import HomeScreen from '../screens/HomeScreen';
export const AppStackNavigator = createStackNavigator({
Home:{screen:HomeScreen},
SelectChapters1:{screen:SelectChapters1},
SelectChapters2:{screen:SelectChapters2},
SelectChapters3:{screen:SelectChapters3},
SelectChapters4:{screen:SelectChapters4},
SelectChapters5:{screen:SelectChapters5},
},
{
initialRouteName:"Home"
}
)