如何使用React Redux从按钮调度道具

import { createStore } from 'redux';

// 定义初始状态
const initialState = {
  prop: '初始值',
};

// 定义reducer函数
const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'UPDATE_PROP':
      return {
        ...state,
        prop: action.payload,
      };
    default:
      return state;
  }
};

// 创建store
const store = createStore(reducer);

import { connect } from 'react-redux';

// 定义组件
const MyComponent = ({ prop, updateProp }) => {
  return (
    <div>
      <p>当前道具值：{prop}</p>
      <button onClick={() => updateProp('新的值')}>更新道具</button>
    </div>
  );
};

// 定义mapStateToProps函数
const mapStateToProps = (state) => {
  return {
    prop: state.prop,
  };
};

// 定义mapDispatchToProps函数
const mapDispatchToProps = (dispatch) => {
  return {
    updateProp: (value) => dispatch({ type: 'UPDATE_PROP', payload: value }),
  };
};

// 使用connect函数连接组件和store
export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);