将 mobx-react-form 对象作为 prop 传递

Question

我正在尝试将 mobx-react-form 对象作为道具传递给我创建的函数组件。问题是当我那样调用我的组件时 <NameEditor form={ newFolderForm }/> 我确实在 NameEditor 组件中获得了表单参数，但它不允许我 'edit' 该字段..就像该字段不可编辑一样，但是当我那样调用组件时 { 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 对象作为 prop 传递

passing mobx-react-form object as a prop

reactjs

mobx

mobx-react