Reactjs 响应钩子窗体对嵌套组件中的验证规则的访问

我想访问嵌套组件中react hook表单的Resister中定义的验证规则，以动态显示所需的指示符（*）。 是否有方法从嵌套组件访问

我不想再以道具的身份传球了

<TextBox ref={register({ required: true })} label="Serial No" name="serialNo" />

const TextBox = React.forwardRef(({ label, name }, ref) => (
    <>
        <label htmlFor={name}>
            {label} {***required*** && <span>*</span>}
        </label>
        <input type="text" name={name} id={name} ref={ref} />
    </>
))

const TextBox=React.forwardRef（（{label，name}，ref）=>(
{label}{***必需***&&&*}
))

看一看

从“React”导入React；
从“react hook form”导入{useForm，FormProvider，useFormContext}；
导出默认函数App（）{
const methods=useForm（）；
const onSubmit=data=>console.log（数据）；
返回(
//将所有方法传递到上下文中
);
}
函数NestedInput（）{
const{register}=useFormContext（）；//检索所有钩子方法
返回；
}

---

它允许您访问嵌套组件级别中的所有钩子形式方法。

这还不能回答问题，我们如何显示必填字段的“*”指示符？

import React from "react";
import { useForm, FormProvider, useFormContext } from "react-hook-form";

export default function App() {
  const methods = useForm();
  const onSubmit = data => console.log(data);

  return (
    <FormProvider {...methods} > // pass all methods into the context
      <form onSubmit={methods.handleSubmit(onSubmit)}>
        <NestedInput />
        <input type="submit" />
      </form>
    </FormProvider>
  );
}

function NestedInput() {
  const { register } = useFormContext(); // retrieve all hook methods
  return <input name="test" ref={register} />;
}