【发布时间】:2021-07-15 12:54:00
【问题描述】:
import * as React from 'react';
import { createAppContainer, createSwitchNavigator } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import { Text, View } from 'react-native';
class LoadingScreen extends React.Component {
dataCheck = () => {
for (i = 0; i < 5; i++) { // data loading time in real code
if (i == 4) {
this.props.navigation.navigate('AppStack')
}
}
}
render() {
return (
<View>
<Text>loading</Text>
{this.dataCheck}
</View>
);
}
}
class MainScreen extends React.Component {
render() {
return (
<View>
<Text>mainscreen</Text>
</View>
);
}
}
const AppNavigator = createStackNavigator(
{
main: MainScreen
},
{
initialRouteName: 'main'
}
)
const LoadNavigator = createSwitchNavigator(
{
load: LoadingScreen,
AppStack: AppNavigator
},
{
initialRouteName: 'load'
}
)
export default createAppContainer(LoadNavigator)
我试图在加载数据时显示加载屏幕。所以我在“LoadingScreen”类中编写了“dataCheck”方法,它一直等到数据被加载(上面代码中的语句)并导航到“AppStack”。 但我认为“this.props.navigation.navigate('AppStack')”不起作用。如何在类的方法中使用 react-navigation?
【问题讨论】:
标签: reactjs react-native react-navigation react-navigation-stack