Блог

Главная - Вопросы по программированию - проблема с хранением данных из кэша в состояние использования в react native

проблема с хранением данных из кэша в состояние использования в react native

#react-native

Вопрос:

     const [loggedInData, setLoggedInData] = useState([]);

    const getLoginFromCache = async() => {
        try{
            let logData = await AsyncStorage.getItem('@MyDish:loginData');  
            let parsed = await JSON.parse(logData);
            console.log(parsed);
            setLoggedInData(parsed);
        }
        catch(error){
            console.log(error);
        }
    }
    
   
    getLoginFromCache()

    console.log(loggedInData);

результат console.log(loggedInData) всегда пуст. в то время как когда я консолю.log(проанализирован), он не возвращается пустым

Ответ №1:

Используйте redux persist для хранения данных в кэше и в состоянии. https://www.npmjs.com/package/redux-persist

Комментарии:

1. я на самом деле хочу сохранить его в состоянии использования react, например. const [LogData, setLogData] = Состояние использования([]);

2. Повторное сохранение намного лучше, чем локальное хранилище asyncstorage

Ответ №2:

Состояние React set является асинхронным, поэтому console.log(loggedInData); всегда будет выводить состояние loggedInData инициализации , в данном случае это состояние представляет собой пустой массив

Попробуйте обернуть свою getLoginFromCache функцию внутри useEffect вот так:

 const [loggedInData, setLoggedInData] = useState([]);
useEffect(() => {
    const getLoginFromCache = async() => {
        try{
            let logData = await AsyncStorage.getItem('@MyDish:loginData');  
            let parsed = await JSON.parse(logData);
            console.log(parsed);
            setLoggedInData(parsed);
        }
        catch(error){
            console.log(error);
        }
    }
    getLoginFromCache()
}, [])

и если вы хотите отслеживать свое loggedInData состояние, вы можете использовать другое useEffect для регистрации этого состояния:

useEffect(() => console.log(loggedInData),[loggedInData])

Метки: