Html 为什么OnChange在Formik中不起作用?

Html 为什么OnChange在Formik中不起作用?,html,reactjs,formik,Html,Reactjs,Formik,我正在尝试在React中使用Formik来创建一个虚拟应用程序。如果我将值作为道具,则无法在任何一个输入框中键入任何内容。另一方面,如果我跳过值道具,那么我可以在框中键入,但在提交时不会将其作为值反映出来 代码如下: export default class DashboardPage extends React.Component { render() { return ( <Formik

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

代码如下:

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>
                        )}
                    />
        );
    }
导出默认类仪表板页面扩展React.Component{
render(){
返回(
{
警报(values.fname);
}}
render={({values,handleChange,handleSubmit})=>(
导出默认类仪表板页面扩展React.Component{
render(){
返回(
警报(values.fname)}
>
{props=>(

尝试将您编写的内容作为元素的子元素放在渲染道具中,方法与示例中相同:handleChange从何而来?我认为您缺少道具?嘿@BOna,是的,它确实解决了问题。您能再帮我一件事吗?假设我想编写自己的handleChane函数,这样我就可以屏蔽这些值或执行任何操作h将值存储在Formik状态之前。可以这样做吗?如何做?嗨,本主题中有一个答案:[我可以问一下,为什么要在将值存储在Formik的初始值之前修改值?如果是用于验证(密码长度,…)这不是怎么做的问题,你可能想照顾你。我也面临同样的问题,但不知道如何解决。你能看看这里吗?
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>
        )
    }
}