根据onChange事件值更改redux状态

// 定义action类型
const CHANGE_VALUE = 'CHANGE_VALUE';

// 定义action创建函数
const changeValue = (value) => {
  return {
    type: CHANGE_VALUE,
    payload: value
  };
};

// 定义reducer
const initialState = {
  value: ''
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case CHANGE_VALUE:
      return {
        ...state,
        value: action.payload
      };
    default:
      return state;
  }
};

// 在组件中使用connect函数连接redux
import { connect } from 'react-redux';

class MyComponent extends React.Component {
  handleChange = (event) => {
    const { dispatch } = this.props;
    const value = event.target.value;
    dispatch(changeValue(value));
  }

  render() {
    const { value } = this.props;
    return (
      <input type="text" value={value} onChange={this.handleChange} />
    );
  }
}

// 将redux状态映射到组件的props
const mapStateToProps = (state) => {
  return {
    value: state.value
  };
};

export default connect(mapStateToProps)(MyComponent);