时间戳

首页 > 解决方案 > React Native AsyncStorage 不起作用 - 现在我做错了什么？

react-native - React Native AsyncStorage 不起作用 - 现在我做错了什么？

问题描述

我要在这里留下什么？此时我只想看到它写入一个值并检索一个值。通过设置变量“appType”，我可以查看它是否正常工作。这不是因为“appType”的初始值没有改变。我可以通过加载哪个页面来判断这一点。我需要这些信息来确定首先加载哪个页面。

import 'react-native-gesture-handler';
import React from 'react';

import { NavigationContainer }    from '@react-navigation/native';
import { createStackNavigator }   from '@react-navigation/stack';

import AsyncStorage  from '@react-native-community/async-storage';

import SpMyPage      from './screens/s_mypg';
import UsMyPage      from './screens/u_mypg';
import UsRegPage     from './screens/u_regs';



function checkAsyncStorage(){
  var appType = '';

  const storeData = async () => {
    try {
      await AsyncStorage.setItem('random_time', '50000')
    } catch (e) {
      // saving error
    }
  }

  const getData = async () => {
    try {
      const value = await AsyncStorage.getItem('random_time')
      if(value !== null) {
        // value previously stored
        appType = 'S';
      }
      else {
        appType = 'U';  
      }
    } catch(e) {
      // error reading value
      appType = 'U';
    }
  }

  return appType; 
}

function PreHomeScreen() {
  var appType = checkAsyncStorage();

  if (appType == 'S') {
    return <SpMyPage />;
  }
  else {
    if (appType == 'U') {
      return <UsMyPage />;
    }
    else {
      return <UsRegPage />;
    }  
  }
}


/* ************************************************************************** */

const Stack = createStackNavigator();

function App() {
  return (
    <>
    <NavigationContainer>
    
      <Stack.Navigator
        initialRouteName = "PreHomeScreen"
        screenOptions={{
          headerShown: false,
        }}>
        <Stack.Screen name="PreHomeScreen" component={PreHomeScreen} />
        <Stack.Screen name="SpMyPage" component={SpMyPage} />
        <Stack.Screen name="UsMyPage" component={UsMyPage} />
        <Stack.Screen name="UsRegPage" component={UsRegPage} />
      </Stack.Navigator>
    
    </NavigationContainer>
    </>
  );
};

export default App;

标签： react-nativeasyncstorage

解决方案

我认为导入 AsynStorage 的正确方法是

import AsyncStorage from '@react-native-community/async-storage';

这是回购的一个例子。 https://github.com/react-native-community/async-storage/blob/master/example/examples/GetSetClear.js

推荐阅读