防止 Formik 重新渲染特定字段

Question

我在我的 React 应用程序中有一个使用 formik-wizard 的表单，在几个页面上我有一个带有附加字段的模式。每次我在模式中输入一个字段时，它都会重新渲染，一次只允许我输入一个字母。有没有办法防止 Formik 在每次值更改时重新渲染？

这是我正在经历的一个例子： https://gyazo.com/cedfb347a01516dd2b2da94787ed332c

Answer 1

问题可能与您的向导有关。向导不应该在每次渲染时打开和关闭，但你的问题不是那个，所以我会回答你的问题。

有没有办法防止 Formik 在每次值更改时重新渲染？

是的，但解决这个问题的方法不止一种。

1. 您可以创建一个使用内部状态的自定义输入，并且仅在用户模糊（onBlur 事件）输入时更新 formik 值，这样可以减少重新渲染。
2. 您还可以在输入更改或输入模糊（这可能导致组件重新呈现）时删除验证，它只会在提交时验证。 (answer on how to do this)

这些方法能解决您的问题吗？

我不知道，您没有向您展示代码，我可以确定是什么让向导出现在每次更改中，而无需查看代码，但这回答了您的问题。