Question

我正在尝试从api获取json响应并成功获取数据但是当我使用redux-thunk在另一个动作中调用动作时，我的数据在reducer内部不可用。 我需要数据＆＃34;数据＆＃34;我的reducer里面的属性进入组件。请检查以下代码。

这是我的行动

＆＃13;

import { GET_REPORT, GET_DATA_SUCCESS } from './types';

export const getData = (text) => {
    
    return (dispatch) => {
        dispatch ({ type: GET_REPORT})
        fetch('http://api.openweathermap.org/data/2.5/forecast?q='+text+'&cnt=1&units=metric&APPID={key}')
            .then(response => response.json())
            .then(data => getDataSuccess(dispatch, data.list[0]))
            .catch((error) => console.log(error));
    };
};

const getDataSuccess = (dispatch, data) => {
    //console.log(data);
    dispatch({
        type: GET_DATA_SUCCESS,
        payload: data
    });
}

＆＃13;

这是我的减速机

＆＃13;

import { GET_REPORT } from'../actions/types';

const INITIAL_STATE = {
    data: '',
}

export default (state = INITIAL_STATE, action) => {
    switch(action.type){
        case GET_REPORT:
            console.log(action.payload); // getting undefined
            return {...state, data: action.payload};
        default:
            return state;
    }
}

＆＃13;

我需要数据＆＃34;数据＆＃34;属性进入组件。

Answer 1

你在减速器中缺少GET_DATA_SUCCESS

Answer 2

操作dispatch ({ type: GET_REPORT})不包含有效负载undefined。您需要使用reducer来处理操作GET_DATA_SUCCESS或修改现有的操作。

为简化起见，dispatch({ type: GET_DATA_SUCCESS, payload: data });包含有效负载，而dispatch ({ type: GET_REPORT})不包含

Answer 3

通过为GET_DATA_SUCCESS添加新的switch case并从getDataSuccess获取有效负载并从GET_REPORT case中删除有效负载来解决它。现在切换案例看起来像这样

＆＃13;

switch(action.type){
        case GET_REPORT:
            return {...state};
        case GET_DATA_SUCCESS:
            console.log(action.payload);
            return{...state, data: action.payload}
        default:
            return state;
}

＆＃13;

无法从reducer内部的动作中获取有效负载反应本机应用程序？

3 个答案: