加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

react-native – React Native Redux – 从asyncstorage初始化默

发布时间:2020-12-15 05:07:04 所属栏目:百科 来源:网络整理
导读:我正在开发一个 Android应用程序,我的屏幕必须取决于用户是否登录.登录数据存储在AsyncStorage中. 当应用程序启动时,它应该从AsyncStorage获取数据并将其作为默认状态.我怎样才能实现这一目标? 下面是我的redux结构 index.android.js import { AppRegistry,
我正在开发一个 Android应用程序,我的屏幕必须取决于用户是否登录.登录数据存储在AsyncStorage中.

当应用程序启动时,它应该从AsyncStorage获取数据并将其作为默认状态.我怎样才能实现这一目标?

下面是我的redux结构

index.android.js

import {
  AppRegistry,} from 'react-native';

import Root from './src/scripts/Root.js';

AppRegistry.registerComponent('reduxReactNavigation',() => Root);

Root.js

import React,{ Component } from "react";
import { Text,AsyncStorage } from "react-native";
import { Provider,connect } from "react-redux";
import { addNavigationHelpers } from 'react-navigation';

import getStore from "./store";
import { AppNavigator } from './routers';

const navReducer = (state,action) => {
    const newState = AppNavigator.router.getStateForAction(action,state);
    return newState || state;
};

const mapStateToProps = (state) => ({
    nav: state.nav
});

const user = {};

class App extends Component {
  constructor(){
    super();
  }

  render() {
    return (
        <AppNavigator
            navigation={addNavigationHelpers({
                dispatch: this.props.dispatch,state: this.props.nav
            })}
        />
    );
  }
}

const AppWithNavigationState = connect(mapStateToProps)(App);

const store = getStore(navReducer);

export default function Root() {
    return (
        <Provider store={store}>
            <AppWithNavigationState />
        </Provider>
    );
}

用户减速器

import {
    REGISTER_USER,UPDATE_USER,LOGIN_USER
} from '../../actions/actionTypes';

import { handleActions } from 'redux-actions';

**// here is the default state,i would like to get from asyncstorage**
const defaultState = {
  isLoggedIn: false,user:{},};

export const user = handleActions({
  REGISTER_USER: {
    next(state,action){
      return { ...state,user: action.payload,isLoggedIn: true }
    }
  },LOGIN_USER: {
    next(state,},defaultState);
您可以使用组件生命周期方法componentWillMount从AsyncStorage获取数据,当数据到达时,您可以更改状态.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读