Error message update or error type change should trigger reRender

[Chastrlove]

Error message update or error type change should trigger reRender

rules: {
        validate: data => {
          if (data === "mm") {
            return true;
          }
          if (data !== "11") {
            return "something error";
          }
          return "error message";
        },
        required:true
      }

import { Form, Input } from "antd";
import React, { useEffect } from "react";
import { FormItemProps } from "antd/lib/form";
import { FieldError } from "react-hook-form/dist/types";
import { InputProps } from "antd/lib/input";
import { useFormContext } from "react-hook-form";
import { FiledType } from "./Demo";
import _ from "lodash";

interface InputItemProps {
  form?: FormItemProps;
  filed: FiledType;
  input?: InputProps;
}

export const MyInput = (props: InputItemProps) => {
  const { register, setValue, errors } = useFormContext();
  const { form = {}, filed } = props;
  const { name, rules } = filed;

  useEffect(() => {
    register({ name }, rules);
  });

  const error = (errors[name] || {}) as FieldError;

  return (
    <Form.Item
      {...form}
      label={form.label || name}
      help={error.message}
      validateStatus={_.isEmpty(error) ? "success" : "error"}
    >
      <Input
        onChange={e => {
          setValue(name, e.target.value, true);

        }}
      />
    </Form.Item>
  );
};

Even the error message change ,it's never trigger reRender.

  const renderBaseOnError = useCallback(
    (
      name: FieldName<FormValues>,
      error: FieldErrors<FormValues>,
      shouldRender = false,
    ) => {
      let reRender = shouldRender;

      if (isEmptyObject(error)) {
        if (fieldsWithValidationRef.current.has(name) || validationSchema) {
          validFieldsRef.current.add(name);
          reRender = reRender || errorsRef.current[name];
        }

        delete errorsRef.current[name];
      } else {
        validFieldsRef.current.delete(name);
        reRender = reRender || !errorsRef.current[name];
      }

      errorsRef.current = validationSchema
        ? schemaErrorsRef.current
        : combineErrorsRef(error);

      if (reRender) {
        render({});
      }
    },
    [validationSchema],
  );

Design so or A bug?

[bluebill1049]

can you provide a codesandbox for this issue? I tested myself and it's working.

[bluebill1049]

ok, I have reproduced the issue, next time please supply a codesandbox for issue report (It's in the issue report template). It will help me a lot with issue discovery and fix it quicker. 🙏

[Chastrlove]

Thanks @bluebill1049 .Next time I will supply a codesandbox for issue report.

[bluebill1049]

i will release the patch tmr @Chastrlove :) thanks for report the issue 多谢了

[Chastrlove]

Recently ,i will refactor my components with react-hook-form .Maybe i will create issues frequently .😀

[bluebill1049]

that will be great @Chastrlove, we all want this lib to be solid and work for everyone 👍