1
leoyzh97 2020-11-22 21:35:26 +08:00 via Android
说不就是受控组件嘛,可以看看 antd form 表单的实现。应该就是父组件生成一个 fieldstore 原来存储子组件的表单字段,生成一个注册方法给子组件注册,然后监听 onchange 事件。
|
2
leoyzh97 2020-11-22 21:35:36 +08:00 via Android
这不就是受控组件嘛,可以看看 antd form 表单的实现。应该就是父组件生成一个 fieldstore 原来存储子组件的表单字段,生成一个注册方法给子组件注册,然后监听 onchange 事件。
|
3
azcvcza 2020-11-23 09:41:03 +08:00
也没到那么搞中间层 form 的地步,你就在
` const Parent = (props)=>{ const [pState,setPState] = useState({}); function handlePStateChange(InputName, value){ setPState({ ...pState, [InputName]:value, }) } return ( <div> <Child id={'1'} handleChange={handlePStateChange} /> .... <Child id={'n'} handleChange={handlePStateChange} /> </div> ) } const Child = (props) =>{ const [input, setInput] = useState(); return ( <Input onChange={(e)=>props.handleChange(props.id, e.target.value)} /> ) } ` |
4
awefeng 2020-11-23 10:48:39 +08:00
父组件给个监听给子组件就好了 固定一下范式
|
5
susunus 2020-11-23 12:43:31 +08:00 via iPhone
usecallback 这个从父组件传给自组件
|
6
ljpCN 2020-11-23 13:11:01 +08:00 via Android
最简单的方式是子组件不要保存状态,状态提升到父组件
|
7
park4ce666 OP 收到并阅读了大家的想法和意见后,我打算试一下给父级组件创建一个 use Context 的钩子,然后子组件通过 Context 和父级共享状态,这么写,每一次应用组件的时候可能要根据子组件的数量和对应的字段属性在父级手动先预设好,感觉还是有些死板,目前我的脑子只够写到这一步了,不知道还能否优化到自动适配子组件。
|
8
KuroNekoFan 2020-11-23 14:41:36 +08:00
需要导出状态变化的组件可以提供一个 props, onCompStateChange,调用方 /父组件通过传入一个函数就可以拿到其状态变化了
子组件不保存状态不是一个好做法,该有本地状态就应该有本地状态 |
9
justsosososo 2020-11-23 16:01:42 +08:00
hook 只是用来简写的新特性 该 props 还是得 props 不要被这些概念混淆了
|