如何解决每次更改表单中的字段时,Forkim的innerRef都会更新
我对Formik还是陌生的,但我却遇到了一个非常烦人的问题,我不得不坚持几天。所以基本上我有一个父组件,其中有这样的代码:
const refs=[]
{data.map((v,i) =>
<Child formikRef={refs}}/> )}
我的子组件使用formik:
...
<Formik
innerRef={i => props.formikRef.push(i)}
....../>
因此,我的子级组件在父级组件中渲染了两次,我需要在父级组件中跟踪每个组件的值。更清楚地说,当我单击位于父组件中的按钮时,我需要获得每个组件的值(我需要将数据从子组件传递到父组件)。这就是为什么我使用innerRef。问题是我正在使用一个ref数组来跟踪每个渲染的值,并且每次更改表单中的字段时都会在数组中添加一个新值,因此数组中的元素数量远远超过了我应有的数量。我认为每次更改字段时都会触发innderRef,而不仅仅是onSubmit。我该如何解决这个问题?请帮助。
解决方法
您可以尝试如下操作,这里我们将索引值传递给Child组件,以使Formik引用位于同一位置。
const refs=[]
{data.map((v,i) =>
<Child index={i} formikRef={refs}}/>
)}
<Formik
innerRef={props.formikRef[props.index]}
/>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。