React Native Redux AsyncStorage возвращает значение NULL - PullRequest
Новая
       21

React Native Redux AsyncStorage возвращает значение NULL

0 голосов
/ 08 мая 2019

Я реализовал асинхронный редуктор и пытаюсь вернуть значение асинхронного хранения, но когда я вызываю диспетчер, он печатает значение в консоли, но не обновляет исходное состояние.

userReducer.js: 

import {AsyncStorage} from "react-native";

const initialState = {
    fullname: null
}
const userReducer = async (state = initialState, action) => {
    switch (action.type) {
        case 'GET_USERNAME':
            const uname= await AsyncStorage.getItem('@uinfo:name', '')
            console.log('uname: '+uname)
            return { fullname: uname}
    }
    return state
}

export default userReducer;

В приведенной выше консоли печатается имя пользователя, но не устанавливается состояние.

Я пытался установить отправку в componentDidMount: 

async componentDidMount() {

        const uname= await this.props.getNAME()
        console.log('uname: '+ this.props.fullname)
    }

console.log ('uname:' + this.props.fullname) возвращает неопределенное значение

Моя картаDispatchToProps: 

function mapDispatchToProps(dispatch) {
    return {
        getNAME: () => dispatch({ type: 'GET_UNAME' })
    }
}

Я что-то упустил, Почему состояние не устанавливается

Ответы [ 3 ]

0 голосов
/ 08 мая 2019

AsyncStorage.getItem() возвращает обещание, поэтому оператор return { fullname: uname} выполняется до оператора await, и после выполнения оператора return функция завершается. Вы можете попробовать это вместо 

AsyncStorage.getItem('@uinfo:name', '').then(res=>{
  if(res)
  return { 
...state,
fullname: uname }
})
0 голосов
/ 08 мая 2019

Может быть, вы используете это неправильно,

действия ничего не возвращают.

Вам необходимо отобразить состояние на реквизиты, используя mapStateToProps config в connect. 

const mapStateToProps = ({
  userReducer
}) =>{
const {fullname} = userReducer;
return fullname;
}

дай это для подключения, 

 export default connect(
  mapStateToProps,
  mapDispatchToProps
)(YouClass);

Вы можете получить доступ к своим данным, используя, this.props.fullname.

cmponentDidUpdate и componentWillReceiveProps сработают, когда редуктор вернет данные.

Примечание: вы вернули данные от редуктора как этот 

return { fullname: uname} // never do this, because you will lost all other data/variables other than fullname.

вместо этого сделайте это, 

return { ...state,fullname: uname} //this will not do anything to other variables
0 голосов
/ 08 мая 2019

полное имя - это элемент из состояния, когда вы присваиваете значение initialState, так что вы можете получить доступ к полному имени, как это. 

import {AsyncStorage} from "react-native";

const initialState = {
    fullname: null
}
const userReducer = async (state = initialState, action) => {
    switch (action.type) {
        case 'GET_USERNAME':
            const uname= await AsyncStorage.getItem('@uinfo:name', '')
            console.log('uname: '+uname)
            state.fullname = uname;
            return { ...state }
    }
    return state
}

export default userReducer;
...