我不明白如何取出令牌。 React-Native + Redux 的授权答案

【问题标题】：I can not understand how to get token out. Authorization on React-Native + Redux我不明白如何取出令牌。 React-Native + Redux 的授权
【发布时间】：2017-10-26 05:49:56
【问题描述】：

美好的一天！我继续结合 react-native 研究 redux。

我需要授权。响应一个后请求，一个令牌来了。它（令牌）显示在控制台中。当您在组件中使用 console.log 输出令牌时，令牌是“未定义”，我不明白如何把它弄出来。错误在哪里？ #菜鸟

在组件中使用：

    ...
import { authorization  } from './reducers/authorization';
...
render(){
const {email, password} = this.state;
let {isLoginPending, loginError} = this.props.login;
let { tokenAuth } = this.props;
     console.log(tokenAuth);      // 'undefined'
     console.log({tokenAuth});      // 'token: undefined'
    ...

动作：

    const LOGIN_REQUEST  = 'LOGIN_REQUEST ';
const LOGIN_ERROR = 'LOGIN_ERROR';
const LOGIN_SUCCESS= 'LOGIN_SUCCESS';

export const setLoginPending = () => {
    return {
        type: LOGIN_REQUEST,
    };
};

export const setLoginSuccess = (tokenAuth) => {
    return {
        type: LOGIN_SUCCESS,
        tokenAuth,
    };
};

export const setLoginError = (loginError) => {
    return {
        type: LOGIN_ERROR,
        loginError
    }
};

export function authorization(email, password) {
    return (dispatch) => {
        dispatch(setLoginPending());
        axios({
            method: 'POST',
            url: 'http://myrmic.geos.tom.ru:2180/v1/auth',
            headers: {
                'Content-Type': 'application/json',
                'Accept' : 'application/json'
            },
            data: {
                ur_email: email = 'super@user.mc',
                ur_password: password = '123456',
            }
        })
            .then((response) => {
                dispatch(setLoginSuccess(response.data))
            })
            .catch((error) => {
                dispatch(setLoginError(error));
            })
    };
}

减速机：

export default function authReducer(state = {
    tokenAuth: false,
    isLoginPending: false,
    loginError: null,
}, action) {
    switch (action.type) {
        case LOGIN_REQUEST:
            return {
                ...state,
                isLoginPending: true,
            };
        case LOGIN_SUCCESS:
            return {
                ...state,
                tokenAuth: action.tokenAuth,
                isLoginPending: false,
            };
        case LOGIN_ERROR:
            return {
                ...state,
                isLoginPending: false,
                loginError: action.loginError
            };
        default:
            return state;
    }
}

【问题讨论】：

你有没有运行mapStateToProps()，你在哪里运行authorization？
参见nodejs.org/api/debugger.html 尝试在动作、reducers 以及调度前后放置一个debugger。进入 repl 以查看状态和道具。您应该能够逐步完成并验证附加到组件的事件处理的每个步骤。它可能会变得更加清晰，而且这是一项很好的技能。马上。

标签： javascript ajax reactjs react-native redux

【解决方案1】：

检查您的response axios 成功回调。看起来response.data 是undefined

.then((response) => {
    dispatch(setLoginSuccess(response.data))
})

【讨论】：