当前位置: 首页 > 知识库问答 >
问题:

父组件中的访问表单(react-fine-form)状态

储嘉悦
2023-03-14

如何访问父组件中的窗体状态

这就是我正在做的(只是一个简短的代码,请忽略语法)

class Parent {
   <listComponent
     onSelect: handler
   >
  handler() {
    // Do this only if the already opened ChildComp in not dirty
     <ChildComp>
  }
}
// Uses react-final-form
class ChildComp {
   <form
      onSubmit: handleSubmit
      render: renderForm
    >
     renderForm ({dirty}){
      // Assigning to a class variable and prompting for unsaved changes which I am able to do
       this.isFormDirty = dirty
      return(
         <InputField>
     );
   }
   </form>
}

现在的问题是,如果onSelect handler()中的子对象脏了,我无法通知父对象不要呈现该子对象。我不能在render方法中执行setState,至少我可以提前通知使用componentDidUpdate,谢谢

共有1个答案

鱼安然
2023-03-14

复制自第551期:

另一种可能性是最近的API更改允许您向

import { createForm } from 'final-form'

function TestForm() {
  const formRef = React.useRef(createForm({
    onSubmit: myOnSubmit
  })
  return (
    <div>
      <Form form={formRef.current}>
        {({ handleSubmit, form }) => (
          <form onSubmit={handleSubmit}> ... fields ... </form>
        )}
      </Form>
      <button onClick={() => formRef.current.reset()}>Reset</button>
    </div>
  )
}

 类似资料:
  • 我在react native中有一个搜索栏组件,它在父组件中导入, SearchBar子组件具有以下元素: 是否可以访问此子组件在其中导入的父组件中的状态?提前感谢你的帮助

  • 我倾向于使用react功能组件和钩子,因为我对react没有太多经验。我想在父功能组件中使用react dual listbox类组件。在这个父组件中,我希望能够访问子类组件的状态。最好的方法是什么? 来自https://github.com/jakezatecky/react-dual-listbox的子响应双列表框组件 包含在标准功能组件中 例如,是否可能在父组件中有一个钩子,该钩子会根据du

  • 我用React构建了3个组件。他们是: 包装器 列表 列表项 如何管理单击的复选框的状态。我想Wrapper知道哪些复选框被选中。

  • 问题内容: 我有两个组件: 父组件 ,我想从中更改子组件的状态: 和 子组件 : 我需要从父组件更改子组件的 打开 状态,还是单击父组件中的按钮时从父组件调用子组件的 toggleMenu() ? 问题答案: 状态应在父组件中进行管理。您可以通过添加属性将值传输到子组件。

  • 我创建了一个包含登录组件和注册组件的签名页面组件。我的问题是,我如何传递一个onhtml函数从父到子,以便更改我的父组件(签名页组件)的状态?我期望的是,通过单击子组件中的按钮,可以切换父组件的活动状态,并根据活动状态更改样式。我试图通过一个处理功能从父到子,但它不能很好地工作。 有什么解决办法吗? codesandbox中的详细信息:https://codesandbox.io/s/wizard