为什么 OnChange 在 Formik 中使用时不起作用？

Question

我正在尝试在 React 中使用 Formik 作为一个虚拟应用程序。如果我给出值作为道具，我将无法在任何一个输入框中输入任何内容。另一方面，如果我跳过 value 属性，那么我可以在框中键入内容，但提交时不会反映为值。

这是代码：

export default class DashboardPage extends React.Component {
    render() {
        return (
                    <Formik
                        initialValues={{ fname: "", lname: "" }}
                        onSubmit={(values) => {
                            alert(values.fname);
                        }}
                        render={({ values, handleChange, handleSubmit }) => (
                            <form onSubmit={handleSubmit}>
                               <input type="text" placeholder="First Name" name="fname" onChange={handleChange} value={values.fname} />
                               <input type="text" placeholder="Last Name" name="lname" onChange={handleChange} value={values.lname} />
                               <button type="submit>ADD<button/>
                            </form>
                        )}
                    />
        );
    }

}

我在这里可能是非常错误的，并且可能会忽略一个小错误，但是任何帮助/建议都是值得赞赏的！

Answer 1

export default class DashboardPage extends React.Component {
  render() {
    return (
      <Formik
        initialValues={{ fname: "", lname: "" }}
        onSubmit={ (values) => alert(values.fname) }
      >
      { props => (
        <React.Fragment>                     
          <form onSubmit={handleSubmit}>
          <input type="text" placeholder="First Name" name="fname" onChangeText={props.handleChange('fname')} />
          <input type="text" placeholder="Last Name" name="lname" onChangeText={props.handleChange('lname')} />
          <button type="submit">ADD</button>
        </form>
        </React.Fragment>
      )}
      </Formik>
    )
  }
}

嗨，伙计，你能试试这个吗？