react-navigation 如何判断用户是否登录跳转到登录页的方法
本文介绍了react-navigation如何判断用户是否登录跳转到登录页的方法，分享给大家，也给自己留个笔记，具体如下：
新建一个index.js
importReact,{Component}from'react';
import{AppRegistry,Text,View,Button,Image,StyleSheet,BackHandler,ToastAndroid}from'react-native';
import{StackNavigator,TabNavigator,NavigationActions}from'react-navigation';
//全局存储
importstroagefrom'./StorageUtil';
import'./Global'
importIndexScreenfrom'./Index'
importMeScreenfrom'./Me'
importLoginfrom'./Login'
//底部菜单栏设置
constMainScreenNavigator=TabNavigator({
IndexScreen:{
screen:IndexScreen,
navigationOptions:{
tabBarLabel:'首页',
headerLeft:null,//去除返回按钮
tabBarIcon:({tintColor})=>(
新建一个全局存储StorageUtil.js
importReact,{Component}from'react';
import{AsyncStorage}from'react-native';
importStoragefrom'react-native-storage';
varstorage=newStorage({
//最大容量，默认值1000条数据循环存储
size:1000,
//存储引擎：对于RN使用AsyncStorage，对于web使用window.localStorage
//如果不指定则数据只会保存在内存中，重启后即丢失
storageBackend:AsyncStorage,
//数据过期时间，默认一整天（1000*3600*24毫秒），设为null则永不过期
defaultExpires:1000*3600*24,
//读写时在内存中缓存数据。默认启用。
enableCache:true,
//如果storage中没有相应数据，或数据已过期，
//则会调用相应的sync方法，无缝返回最新数据。
//sync方法的具体说明会在后文提到
//你可以在构造函数这里就写好sync的方法
//或是写到另一个文件里，这里require引入
//或是在任何时候，直接对storage.sync进行赋值修改
//sync:require('./sync')//这个sync文件是要你自己写的
})
//最好在全局范围内创建一个（且只有一个）storage实例，方便直接调用
//对于web
//window.storage=storage;
//对于reactnative
//global.storage=storage;
//这样，在此**之后**的任意位置即可以直接调用storage
//注意：全局变量一定是先声明，后使用
//如果你在某处调用storage报错未定义
//请检查global.storage=storage语句是否确实已经执行过了
//导出为全局变量
global.storage=storage;
新建一个全局变量组件Global.js，用户存储用户登录的信息
//用户登录数据
global.user={
loginState:'',//登录状态
userData:'',//用户数据
};
//刷新的时候重新获得用户数据
storage.load({
key:'loginState',
}).then(ret=>{
global.user.loginState=true;
global.user.userData=ret;
}).catch(err=>{
global.user.loginState=false;
global.user.userData='';
})
登录组件Login.js
_login(){//登录函数
//debugger;
ToastUtil.show("登录成功");
//使用key来保存数据。这些数据一般是全局独有的，常常需要调用的。
//除非你手动移除，这些数据会被永久保存，而且默认不会过期。
storage.save({
key:'loginState',//注意:请不要在key中使用_下划线符号!
data:{
userid:'1001',
userName:'userName',
token:'token'
},
//如果不指定过期时间，则会使用defaultExpires参数
//如果设为null，则永不过期
//8个小时后过期
expires:1000*3600*8
});
global.user.loginState=true;//设置登录状态
global.user.userData={userid:'1001',userName:'userName',token:'token'};//保存用户数据
setTimeout(()=>{
this.props.navigation.navigate('UserScreen')//跳转到用户页面
},2000)
}
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。