reactjs – “动作可能没有未定义的”类型“属性.你拼错了吗？“

发布时间：2020-12-15 20:11:13 所属栏目：百科来源：网络整理

导读：我正在开发一个Facebook应用程序,我正在使用两个不同的模块： AdonisJS和 react-redux-starter-kit.我有一个操作来存储在执行回调函数时使用Facebook登录按钮登录的用户： callback = (r) = { const { addLinkedAccount } = this.props addLinkedAccount({ u

我正在开发一个Facebook应用程序,我正在使用两个不同的模块： AdonisJS和 react-redux-starter-kit.我有一个操作来存储在执行回调函数时使用Facebook登录按钮登录的用户：

callback = (r) => {
  const { addLinkedAccount } = this.props

  addLinkedAccount({
    userId: r.userId,name: r.name,accessToken: r.accessToken,email: r.email
  })
}

整个行动档案：

import { CALL_API } from 'redux-api-middleware'

// ------------------------------------
// Constants
// ------------------------------------
export const ADD_LINKED_ACCOUNT = 'linkedAccount:add_linked_account'
export const ADD_LINKED_ACCOUNT_SUCCESS = 'linkedAccount:add_linked_account_success'
export const ADD_LINKED_ACCOUNT_FAIL = 'linkedAccount:add_linked_account_fail'

// ------------------------------------
// Actions
// ------------------------------------
export function addLinkedAccount ({ userId,name,accessToken,email }) {
  return {
    [CALL_API]: {
      endpoint: '/api/linked-accounts',method: 'POST',headers: {
        'Accept': 'application/json','Content-Type': 'application/json'
      },body: JSON.stringify({ userId,email }),types: [ADD_LINKED_ACCOUNT,ADD_LINKED_ACCOUNT_SUCCESS,ADD_LINKED_ACCOUNT_FAIL]
    }
  }
}

export const actions = {
  addLinkedAccount
}

// ------------------------------------
// Action Handlers
// ------------------------------------
const ACTION_HANDLERS = {
  [ADD_LINKED_ACCOUNT]: state => ({
    ...state,addingLinkedAccount: true
  }),[ADD_LINKED_ACCOUNT_SUCCESS]: (state,action) => ({
    ...state,addingLinkedAccount: false,addLinkedAccountSuccess: true,linkedAccount: action.payload
  }),[ADD_LINKED_ACCOUNT_FAIL]: (state,addLinkedAccountError: action.payload.response.error
  })
}

// ------------------------------------
// Reducer
// ------------------------------------
const initialState = {
  addingLinkedAccount: false,addLinkedAccountSuccess: false,linkedAccount: null,addLinkedAccountError: {}
}

export default function linkedAccountReducer (state = initialState,action) {
  const handler = ACTION_HANDLERS[action.type]

  return handler ? handler(state,action) : state
}

执行回调时,控制台中的错误消息：

Uncaught Error: Actions may not have an undefined “type” property. Have you misspelled a constant?

解决方法

addLinkedAccount返回的操作确实没有类型字段,但在阅读redux-api-middleware的文档时,似乎这正是应该如何构造操作的.

我的猜测是你没有将中间件安装到你的商店.如中间件文档中所述,您必须像这样创建商店：

import { createStore,applyMiddleware,combineReducers } from 'redux';
import { apiMiddleware } from 'redux-api-middleware';
import reducers from './reducers';

const reducer = combineReducers(reducers);
// the next line is the important part
const createStoreWithMiddleware = applyMiddleware(apiMiddleware)(createStore);

export default function configureStore(initialState) {
  return createStoreWithMiddleware(reducer,initialState);
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!