Как передать реагирующему компоненту редуксное действие в качестве реквизита

Question

Я хочу создать общий компонент флажка UI, завернутый в соединение с резервированием. Я хотел бы передать компоненту избыточное действие в качестве реквизита, чтобы затем я мог использовать это действие для действия диспетчерского соединения:

const CheckBoxWithState = connect(
  state => ({
    xxxxxxxxxxxxx
  }),
  dispatch => (
    dispatch(this.props.reduxAction)
  ),
)(CheckBox)

Возможно ли это сделать?

Answer 1

Второй параметр connect (mapDispatchToProps) получает два параметра: dispatch и props компонента. Таким образом, вы можете использовать props следующим образом:

const CheckBoxWithState = connect(
  state => ({
    xxxxxxxxxxxxx
  }),
  (dispatch, props) => ({
    action: actionPayload =>
      dispatch({ type: props.reduxAction, payload: actionPayload })
  })
)(CheckBox);

Затем вызвать действие в CheckBox:

const CheckBox = (props) => {
   const { action } = props;
   const onChange = (value) => {
      action({ checked: value });
   }
   // ...
}