首页 > 解决方案 > connect() 中的 mapStateToProps() 必须返回一个普通对象,而不是收到 Undefined

问题描述

我已经实现了 redux 来完成一个 TODO 应用程序。

我的待办事项代码

 import { connect } from "react-redux";

import TodoList from "../components/TodoList.js";

// Here we will connect 

const mapStateToProps = state => {
    todos: state.todos
}

const mapDispatchToProps = dispatch => {
    toggleTodo: id => dispatch({ type: 'TOGGLE_TODOS', id })


}


export default connect(mapStateToProps, mapDispatchToProps)(TodoList);

// 减速器

 const todos = (state = [], action) => {
    switch (action.type) {
        case 'ADD_TODO':
            return [
                ...state, {
                    id: action.id,
                    text: action.text,
                    visibility: false
                }
            ]
        case 'TOGGLE-TODO':
            return state.map(todo => (todo.id === action.id)
                ?
                { ...todo, completed: !todo.completed }
                : todo)
        default:
            return state;
    }

}

export default todos;

最后我收到一个错误,因为“mapStateToProps 必须接收一个普通对象,而不是接收未定义”。

请让我知道如何解决这个问题。

标签: react-nativereduxreact-redux

解决方案


您需要返回对象,您可以这样做,请查看对象周围的括号。

const mapStateToProps = state => ({
    todos: state.todos
})

你也可以做

const mapStateToProps = state => { 
    return { todos: state.todos }; 
};

两者都返回一个对象。


推荐阅读