Как перенести функцию в Redux?

Question

[nivaech]

Практикуюсь с Redux, делаю простой todo-list. Начал интегрировать все это дело в Redux, и понял что пока не до конца осознал его логику. В общем. Есть три основных экшена:

const mapDispatchToProps = (dispatch) => {
    return {
        addTodo: (todo) => dispatch({ type: 'ADD_TODO', todo: todo }),
        handleChange: (e) => dispatch({ type: 'HANDLE_CHANGE', e: e }),
        handleSubmit: (e) => dispatch({ type: 'HANDLE_SUBMIT', e: e })
    }
}

И их редьюсеры:

const reducerTodoList = (state = initialState, action) => {
    const newState = {...state};

    switch (action.type) {
        case 'DEL_TODO':
            const todos = state.todos.filter(todo => {
                return todo.id !== action.id;
            });
            return {
                todos: todos
            }

        case 'ADD_TODO':
            action.todo = Math.random();
            const todoos = [...state.todos, action.todo]
            return {
                todos: todoos
            }
        
        case 'HANDLE_CHANGLE':
            return {
                content: action.e.target.value
            }
        
        case 'HANDLE_SUBMIT':
            action.e.preventDefault();
            return {
            ...
            }
        
            default:
                return state;
    }
}

И вот в случае HANDLE_SUBMIT возникла путаница. В НЕ Redux версии функция выглядела так:

handleSubmit = (e) => {
    e.preventDefault();
    this.props.addTodo(this.state);
    this.setState({
        content: ''
    })

То есть она обращалась к функции addTodo и в качестве пропса принимала значение state. Как в случае с case 'HANDLE_SUBMIT' все это переписать?

Answer 1

[Антон Спирин]

handleChange и handleSubmit в редьюсере делать нечего. Оставьте эти хандлеры в компоненте.