Отображение 2 разных состояний от одного и того же редуктора без состояния перезаписывает себя - PullRequest
0 голосов
/ 16 ноября 2018

Я создаю большое приложение, которое получает различную музыку, аудио и видео с одного и того же редуктора, и я хотел получить последние 5 музыкальных аудио и видео с этого редуктора, но оба они находятся в одном и том же редукторе, как мне получить обе данные без них переписывают друг друга как я использую действия?

1 Ответ

0 голосов
/ 16 ноября 2018

Я не понимаю ваш вопрос ясно, и я думаю, что лучше опубликовать ваш код.

Но если я правильно понял, я думаю, что вы используете один и тот же объект для хранения их обоих. Ваш код должен быть примерно таким.

at reducer.js

const INITIAL_STATE = {
    musicList: [],
    videoList: []
};

export function reducerX(state = INITIAL_STATE, action) {
    switch (action.type) {
        case 'FETCHING_MUSIC_SUCCESS':
            return {
                ...state, musicList: action.payload, loading: false
            };
        case 'FETCHING_MUSIC_LOADING':
            return { ...state, loading: true };

        case 'FETCHING_MUSIC_FAILED':
            return {
                ...state,
                error: 'failed to fetch music',
                loading: false
            };

        case 'FETCHING_VIDEO_SUCCESS':
            return {
                ...state, videoList: action.payload, loading: false
            };
        case 'FETCHING_VIDEO_LOADING':
            return { ...state, loading: true };

        case 'FETCHING_VIDEO_FAILED':
            return {
                ...state,
                error: 'failed to fetch video',
                loading: false
            };
    }
}


на actionX.js

export function fetchMusic() {
    return dispatch => {
        dispatch({
            type: 'FETCHING_MUSIC_LOADING'
        });
        return API.get('/app/rest/music')
            .then(({ data: music }) =>
                dispatch({
                    type: 'FETCHING_MUSIC_SUCCESS',
                    payload: music
                })
            )
            .catch(error => dispatch({ type: 'FETCHING_MUSIC_FAILED', payload: error }));
    };
}

export function fetchVideo() {
    return dispatch => {
        dispatch({
            type: 'FETCHING_VIDEO_LOADING'
        });
        return API.get('/app/rest/video')
            .then(({ data: video }) =>
                dispatch({
                    type: 'FETCHING_VIDEO_SUCCESS',
                    payload: video
                })
            )
            .catch(error => dispatch({ type: 'FETCHING_VIDEO_FAILED', payload: error }));
    };
}
...