使用React和Formik将值传递到高阶组件

Question

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

这样做的原因是我想在某些情况下操纵数据。我知道我可以使用Formik的values，但我不知道如何操纵它。有没有办法将inputValue传递给withFormik或不可能的HoC？

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);