Saya telah berjuang dengan ini selama 18 jam terakhir dan saya tidak tahu apa yang saya lakukan salah. Saya memiliki pengaturan redux dan saya telah mengirim tindakan dan menerima status dengan benar untuk komponen lain tetapi dalam satu komponen saya ingin mengirim tindakan saat klik, yang kemudian memanggil api dan menetapkan status aplikasi di redux dengan hasil api.

Tapi itu tidak mengembalikan apa pun. Saya dapat secara manual mengatur payload dengan string jika saya mengkodekannya dengan keras sehingga saya tahu tindakannya dipecat ok. Saya juga telah memeriksa bahwa api berfungsi dengan baik dan saya bahkan mencoba mengganti api dengan hasil dummy jsontypicode untuk melihat apakah itu membuat perbedaan, ternyata tidak. Adakah yang bisa tolong BANTUAN mengarahkan saya ke arah yang benar??

Berikut kode saya.

TINDAKAN:

import axios from 'axios';
import { SET_POSTS } from "./types";

export const setPosts = () => dispatch => {
    axios
        .get(`https://jsonplaceholder.typicode.com/todos/`)
        .then(res =>
            dispatch({
                type: SET_POSTS,
                payload: res.data,
                settingCorrect: true
            })
        )
        .catch(err =>
            dispatch({
                type: SET_POSTS,
                payload: {}
            })
        );
};

PEREDAM:

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

const initialState = {
    loading: true,
};

export default function(state = initialState, action){

    const { type, payload } = action;

    switch(type){
        case SET_POSTS:
            return {
                ...state,
                posts: payload,
                loading: false
            }
        default:
            return state;
    }

}

APLIKASI:


    selectUnit = (e,unit) => {
            this.props.setPosts();
            this.props.setHistoricalData(unit);
    };

   ....

const mapDispatchToProps = (dispatch) => {
    return {
        setPosts: () => {
            dispatch({
                type: 'SET_POSTS',
            })
        },
        setHistoricalData: (history) => {
            dispatch({
                type: 'GET_HISTORICAL_DATA'
            })
        }
    }
};

export default connect(mapStateToProps,mapDispatchToProps)(Posts);
0
Stephanie Parker 29 Oktober 2019, 04:05

1 menjawab

Jawaban Terbaik

Sepertinya Anda tidak menggunakan action create di mapDispatchToProps. Jika saya memahami arsitektur Anda dengan benar, berikut ini akan menjadi mapDispatchToProps yang benar:

const mapDispatchToProps = (dispatch) => {
    return {
        setPosts: () => {
            dispatch(setPosts())
        },
        setHistoricalData: (history) => {
            dispatch(getHistoricalData(history))
        }
    }
};

Sambil mengingat untuk mengimpor fungsi pembuat tindakan Anda.

0
Nick 29 Oktober 2019, 01:11