отреагировать не показывать getStore

Question

Я новичок в React Redux.

Это фантастика, так что Я хочу видеть о задачах состояния магазина. но не вижу этого.

результат

задач: [undefined]

1012 * Ask *

так как я могу?

здесь код:

import { createStore } from 'redux'

const initalState = {
    tasks: []
}


function tasksReducer(state = initalState, action) {
    switch (action.type) {
        case 'ADD_TASK':
            return {
                ...state,
                tasks: state.tasks.concat([action.task])
            };
        default:
            return state;
    }
}

const addTask = (task) => ({
    type: 'ADD_TASK',
    payload: {
        task
    }
})


const store = createStore(tasksReducer)


store.dispatch(addTask('like it'))

console.log(store.getState()) <-- here

Answer 1

Проблема в ваших действиях. Он добавляет задачу с ключом payload, но вы пытаетесь объединить его с action.task (которого нет).

Объект, который будет отправлен в ваш редуктор, будет выглядеть так:

{
    type: 'ADD_TASK',
    payload: {
        task: 'like it'
    }
}

Вы можете ясно видеть здесь, action.task не существует, но action.payload.task существует. Либо измените объект вокруг, либо измените его, чтобы вы могли получить к нему доступ в action.task:

const addTask = (task) => ({
    type: 'ADD_TASK',
    task
})

Или , измените ваш редуктор:

function tasksReducer(state = initalState, action) {
    switch (action.type) {
        case 'ADD_TASK':
            return {
                ...state,
                tasks: state.tasks.concat([action.payload.task])
            };
        default:
            return state;
    }
}

В будущем: небольшая отладка прошла бы долгий путь (и вообще избежал бы этого вопроса). Простой console.log(action) в верхней части вашего редуктора будет регистрировать вышеуказанный объект, и вы сможете сделать вывод, основываясь на том, почему он пытается добавить неопределенное, почему он не будет работать.