在 react redux 中使用 rsaa 中间件时的操作未定义答案

【问题标题】：Action undefined when using rsaa middleware in react redux在 react redux 中使用 rsaa 中间件时的操作未定义
【发布时间】：2019-01-22 23:37:35
【问题描述】：

我使用this guide 使用来自Django REST 框架的jwt 令牌身份验证通过我的api 设置身份验证。我可以正常登录。但目前我设置了另一个端点来获取当前授权用户的用户信息（由他们随请求发送的令牌确定）。

它是这样发送的（在用户登录后一段时间完成）

fetchUser: () => dispatch(loadUser()),

我的操作加载用户名：

import { RSAA } from 'redux-api-middleware';
import withAuth from '../reducers'

export const USER_REQUEST = '@@user/USER_REQUEST';
export const USER_SUCCESS = '@@user/USER_SUCCESS';
export const USER_FAILURE = '@@user/USER_FAILURE';

export const loadUser = () => ({
    [RSAA]: {
        endpoint: '/api/user/info/',
        method: 'GET',
        headers: withAuth({}),
        types: [
            USER_REQUEST, USER_SUCCESS, USER_FAILURE
        ]
    }
});

减速器：

import jwtDecode from 'jwt-decode'
import * as user from '../actions/user'

const initialState = {};

export default (state=initialState, action) => {
    switch(action.type) {
        case user.USER_SUCCESS:
            return action.payload;
        default:
            return state
    }
}
export const userInfo = (state) => state.user;

减速器index.js：

export function withAuth(headers={}) {
    return (state) => ({
        ...headers,
        'Authorization': `Bearer ${accessToken(state)}`
    })
}

export const userInfo = state => fromUser.userInfo(state.user);

但是当我尝试获取登录用户的用户信息时，我得到一个错误..

TypeError: 无法读取未定义的属性“类型”

为什么动作类型未定义？

注意：我用 thunk 标记了这个，因为我的项目确实使用了 thunk，但不是为了这一点 redux。

编辑：我的middleware.js 和我的store.js。

【问题讨论】：

你的中间件代码在哪里
@GauravPaliwal 在我的帖子末尾添加了它们。
您是否使用了错误的loadUsername 函数？为什么你有两个？（减速机中的一个）
@azium 我确定我使用的是正确的。来自onSubmit 的调度正在调用我的操作文件中的调度。另一种是我的matchStateToProps中使用的状态访问方法。我只是懒得给他们不同的名字。如果您想查看完整的代码，我还提交了我当前的所有更改。我会将相关文件作为链接添加到我的帖子中，以便于访问。

标签： reactjs redux jwt redux-thunk

【解决方案1】：

问题是在store.js 中thunk 在redux-api-middleware 中间件之前应用。

像这样把它移到后面：

const store = createStore(
        reducer, {},
        compose(
            applyMiddleware(apiMiddleware, thunk, routerMiddleware(history)),
            window.devToolsExtension ? window.devToolsExtension() : f => f,
        ),
    );

【讨论】：