Reactjs 从功能组件中公开功能-React

我有一个功能组件

表单

。我需要从中公开一个函数

validate

Validate通常在表单中使用状态变量

现在，我想不出一种方法来公开它，无论哪个组件使用

表单

，它都可以像下面这样简单地验证表单

 const { validateForm } = Form;
 const isFormValid = validateForm();

如果我的表格如下所示

const Form = () => {
    const isError = () => {}
    const isEmpty = () => {}
    const validate = () => {
        return isError() || isEmpty();
    }
}

有没有一种方法可以通过钩子实现？我现在不能动弹不得。

我完全理解它打破了陈述性的哲学，是一种强制性的方式，但是在一些用例中这是必需的。尤其是当人们通过图书馆公开它时。Ant design也会这样做-

---

因此，我完全同意。

是的，您可以通过执行以下操作将

useRef

与

useImperialiveHandle

结合使用：

• 您的

  表单

  必须使用

  React.forwardRef

  转发ref

constmyform=React.forwardRef（（props，ref）=>{

• 通过以下方式使用

  useImperialiveHandle

  钩子在表单组件内声明表单验证：

• 在表单的父级中，创建一个ref并将其传递给表单

然后在您的事件中只需使用

formRef.current.validate（）；

---

请在

中找到演示。是的，有一种命令式方法，而不是声明式方法。编写代码沙盒demo@MohamedELAYADI请这样做。你也可以提示我。也许这并不打动我。啊，很抱歉刚才看到你的评论，提示是使用

useImperialiveHandle

hookI更新了演示以期望验证rat返回值她比显示福尔玛的警报要好！多好啊。我只是在测试：）您好。这是对我的组件的一个突破性更改。例如，我将无法再执行

，因为

项

已附加到表单对象，该表单对象现在已使用forwardRef函数包装。您有何建议？forward ref仅转发来自父对象的ref，并使其可从cild访问。它不会影响您的l如果您可以提交一个代码沙盒来说明您的问题，我们可以提供帮助

  React.useImperativeHandle(ref, () => ({
    validate: () => {
      alert("now, the form is validating");
    }
  }));