Question

我正在尝试将mobx-react-form对象作为prop传递给我创建的函数组件。问题是当我这样调用我的组件时 <NameEditor form={ newFolderForm }/> 我确实在NameEditor组件中获得了表单参数，但它不允许我“编辑”该字段..它就像字段不可编辑一样，但是当我这样调用组件时 { NameEditor({ form: newFolderForm }) } 它工作得很好，我错过了什么？这两种方式在功能组件中是不是应该相同？

编辑：这是我获取表单的方式

const NameEditor = ({ form }) => (
 <form onSubmit={ form.onSubmit }>
  <input { ...form.$('name').bind() }/>
  <p>{ form.$('name').error }</p>
  <button>Save</button>
 </form>
)

感谢

Answer 1

请确保您使用observer()在您的功能组件上，从您在那里展示的代码我认为您错过了这一部分。

const NameEditor = observer(({ form }) => (
 <form onSubmit={ form.onSubmit }>
  <input { ...form.$('name').bind() }/>
  <p>{ form.$('name').error }</p>
  <button>Save</button>
 </form>
))

https://mobx.js.org/refguide/observer-component.html 阅读它如何与无状态功能组件一起使用

将mobx-react-form对象作为道具传递

1 个答案: