【问题标题】:How can i use react-navigation in class method?我如何在类方法中使用反应导航?
【发布时间】: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


    【解决方案1】:

    你只需要替换

     {this.dataCheck}
    

    {this.dataCheck()}
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-10-23
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多