本文介绍了在 react-native 中设置动态“initialRouteName"的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问题很简单我知道同一个问题有很多答案,但我设置了自己的 App.js 文件,我尝试了几乎所有但没有成功.

所以我的 App.js 看起来像这样

import React, { Component } from 'react';进口 {平台,样式表,文本,看法,状态栏来自'反应原生';import { createStackNavigator } from 'react-navigation';import { Header, Button, Spinner } from './src/components/comman';从 'react-native-splash-screen' 导入 SplashScreen;从'./src/components/LoginForm'导入登录表单;从'./src/components/SignupForm'导入注册表格;从'./src/components/Home'导入首页;从'./src/components/ForgetPassword'导入忘记密码;从'react-native'导入{YellowBox};YellowBox.ignoreWarnings(['Warning: isMounted(...) is deprecated', 'Module RCTImageLoader']);const App = createStackNavigator ({登录:{屏幕:登录表单},主页:{屏幕:主页},注册:{屏幕:注册表格},忘记密码:{屏幕:忘记密码},},{initialRouteName: '登录',});导出默认应用程序;

现在我将登录状态存储在我的 LoginForm.js 中的 AsyncStorage

..AsyncStorage.setItem('isLoggedIn', 'true').then((a) => {this.onLoginSuccess(responseData.user_id);});..

所以现在我想根据我的本地存储元素设置 initialRouteName.简单如果 isLoggedIntrue 然后 initialRouteName : Home 否则 initialRouteName : Login

简单但不知道如何在my App.js

请帮忙:)

解决方案

如你所见 这里:

如果您需要将 initialRouteName 设置为 prop,那是因为在呈现应用导航之前,您需要异步获取一些数据.处理此问题的另一种方法是使用 switchnavigator 并在获取异步数据时显示一个屏幕,然后在必要时使用参数导航到适当的初始路由.有关完整示例,请参阅 docs.

这是一个开放的RFC

更新

查看此处.

您会找到更多说明!

question is simple I know there are lots of answers available for the same question but I have differently set my own App.js file i tried almost all but no success.

so my App.js looks like this

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  StatusBar
} from 'react-native';
import { createStackNavigator  } from 'react-navigation';
import { Header, Button, Spinner } from './src/components/comman';
import SplashScreen from 'react-native-splash-screen';
import LoginForm from './src/components/LoginForm';
import SignupForm from './src/components/SignupForm';
import Home from './src/components/Home';
import ForgetPassword from './src/components/ForgetPassword';


import { YellowBox } from 'react-native';
YellowBox.ignoreWarnings(['Warning: isMounted(...) is deprecated', 'Module RCTImageLoader']);
const App = createStackNavigator ({
  Login: { screen: LoginForm },
  Home: { screen: Home },
  Signup: { screen: SignupForm },
  ForgetPassword: { screen : ForgetPassword },
  },
  { 
  initialRouteName: 'Login',
  });

export default App;

Now I store login state in AsyncStorage in my LoginForm.js like this

.
.
AsyncStorage.setItem('isLoggedIn', 'true').then((a) => {
    this.onLoginSuccess(responseData.user_id);
});
.
.

so now i want to set initialRouteName based on my local storage element.Simple if isLoggedIn is true then initialRouteName : Home otherwise initialRouteName : Login

Simple but don't how to use this in my App.js

Please help :)

解决方案

As you can see here:

And this is an open RFC

UPDATE

Take a look at here.

You'll find more description!

这篇关于在 react-native 中设置动态“initialRouteName"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-15 05:41