reactjs - 使用 React 和 Formik 将值传递给高阶组件

Question

我目前正在使用 react 和 formik 在我的页面上制作表单，但遇到了问题。我目前有一个名为的状态变量inputValue，我想将其用作用户输入表单时的持有者。我遇到的问题是将其纳入handleSubmit内部withFormik。

这样做的原因是我想在某些情况下操作数据。我知道我可以values从 Formik 使用，但我不知道如何操作它。有没有办法inputValue进入 HoC 是可能的withFormik还是不可能的？

class SendMessageContainer extends React.Component {
   constructor(props) {
      super(props);
      this.state = {
        inputValue: '',
      };
      this.handleChange = this.handleChange.bind(this);
   }

  handleChange = (e) => {
    this.setState({ inputValue: e.target.value });
  };

  render() {
     const {
        placeholder,
        values,
        handleChange,
        handleBlur,
        handleSubmit,
        isSubmitting,
        channelId,
     } = this.props;

     return (
        <Input
           onKeyDown={(e) => {
              if (e.keyCode === ENTER_KEY && !isSubmitting) {
                 handleSubmit(e);
              }
           }}
           onChange={(e) => {
              this.handleChange(e);
           }}
           onBlur={handleBlur}
           name="message"
           value={this.state.inputValue}
           placeholder={`Message #${placeholder}`}
        />
     );
   }
}

export default withFormik({
  mapPropsToValues: () => ({ message: '' }),
  handleSubmit: async (values, { props, setSubmitting, resetForm }) => 
  {
     if (!values.message || !values.message.trim()) {
        setSubmitting(false);
        return;
     }

     await props.onSubmit(values.message);
     resetForm(false);
  },
})(SendMessageContainer);