时间戳

首页 > 解决方案 > Redux 操作未触发 - 没有错误

javascript - Redux 操作未触发 - 没有错误

问题描述

我试图在点击时调用一个简单的动作来触发调度动作。我似乎无法得到结果，甚至没有迹象表明它正在发射。

我正在尝试在组件中单击时分派。我还尝试在操作中放置一个 console.log 以查看它是否甚至被触发，但它没有。Redux 开发工具也不建议它在点击时被触发。

onClick={() => {
   setAQIType(name);
}}

行动：

import { SET_AQITYPE } from "./types";

export const setAQIType = (AQIType) => dispatch => {
    dispatch({
        type: SET_AQITYPE,
        payload: { AQIType }
    });
};

减速器：

import { SET_AQITYPE } from '../actions/types';

const initialState = {
    aqiType: 'DEFAULT',
    loading: false,
};

export default function(state = initialState, action){

    const { type, payload } = action;

    switch(type){
        case SET_AQITYPE:
            return [...state, payload];
        default:
            return state;
    }

}

类型：

export const SET_AQITYPE = 'SET_AQITYPE';

标签： javascriptreactjsredux

解决方案

三个错误，

  1. 在 reducer 中：您的状态是一个object而不是一个列表。
  2. 在减速器中：将有效负载分配给aqiType键
  3. 在调度中：有效负载是一个字符串而不是一个对象。

修理：

export const setAQIType = (AQIType) => dispatch => {
    dispatch({
        type: SET_AQITYPE,
        payload: AQIType // (3) pass as string
    });
};

// In reducer
case SET_AQITYPE:
  return { // (1) object
    ...state,
    aqiType: payload // (2) specify aqiType key
  };

这假设您已经使用和检查了基本示例。connect()mapDispatchToProps

推荐阅读