mapStateToProps

mapStateToProps 是 React 应用中与 Redux 结合使用时的一个重要概念。它是一个函数，用于将 Redux store 中的状态映射到 React 组件的 props 上。通过这个函数，你可以选择组件需要订阅的 state 部分，并在 Redux store 更新时自动更新组件的 props。

下面是如何使用 mapStateToProps 的基本步骤：

定义一个函数：首先，你需要定义一个名为 mapStateToProps 的函数（也可以是其他名称），该函数接收整个 Redux store 的 state 作为其第一个参数。
选择状态：在这个函数内部，你选择组件所需的部分状态，并返回一个对象。这个对象的键将成为组件的 props。
连接组件：最后，使用 react-redux 提供的 connect 函数来将你的组件和 Redux store 连接起来。connect 函数的第一个参数就是 mapStateToProps。

一个简单的例子如下：

import { connect } from 'react-redux';function mapStateToProps(state) {return {todos: state.todos // 假设 Redux store 中有一个 todos 键};
}// 假设我们有一个名为 TodoList 的组件
const ConnectedTodoList = connect(mapStateToProps)(TodoList);export default ConnectedTodoList;

在这个例子中，TodoList 组件将会接收到 todos 作为一个 prop，这些 todos 实际上来自于 Redux store 的状态。

需要注意的是，随着 React 和 Redux 的发展，现在推荐使用 React-Redux 的 hooks API，比如 useSelector 和 useDispatch，它们提供了更简洁的方式来进行相同的操作。例如：

import React from 'react';
import { useSelector } from 'react-redux';function TodoList() {const todos = useSelector(state => state.todos);return (<ul>{todos.map(todo => (<li key={todo.id}>{todo.text}</li>))}</ul>);
}export default TodoList;