时间戳

首页 > 解决方案 > 什么时候不使用 Formik 的 FastField？

javascript - 什么时候不使用 Formik 的 FastField？

问题描述

在 Formik 的FastField的文档中，它有很多你应该在什么时候使用它以及它是如何工作的，但是有没有你不应该使用的情况？

因为如果在某些FastField情况下更快而在其他情况下没有任何区别，为什么不总是使用FastField？有没有使用Field优于的情况FastField？

标签： javascriptreactjsformik

解决方案

FastField 有一个 shouldComponentUpdate ，它“关注”仅对其自身道具的更改。

如果您的用例由于任何其他更改而需要重新渲染字段，则不要使用 FastField。即使其他一些道具发生变化，您的组件也不会更新。

此外，根据文档，由于 Formik 字段的重新渲染导致的性能问题可能仅在表单很大（> 30 个字段）的情况下出现。他们建议仅对 >30 个字段使用 FastFields。

shouldComponentUpdate(props: FastFieldInnerProps<Values, Props>) {
    if (this.props.shouldUpdate) {
      return this.props.shouldUpdate(props, this.props);
    } else if (
      props.name !== this.props.name ||
      getIn(props.formik.values, this.props.name) !==
        getIn(this.props.formik.values, this.props.name) ||
      getIn(props.formik.errors, this.props.name) !==
        getIn(this.props.formik.errors, this.props.name) ||
      getIn(props.formik.touched, this.props.name) !==
        getIn(this.props.formik.touched, this.props.name) ||
      Object.keys(this.props).length !== Object.keys(props).length ||
      props.formik.isSubmitting !== this.props.formik.isSubmitting
    ) {
      return true;
    } else {
      return false;
    }
  }

推荐阅读