[Form] onChange拿到的e.values能否是纯对象？

[xmsz-stu]

Which Component Need Enhancement 期望新增功能的组件

• Form

What does the proposed API look like 期望支持的API

获取纯对象

Feature Description 功能描述

const [state, setState] = useState();
   useEffect(()=>{
        console.log(state)
    },[state])

<Form onChange={(e) => setState(e.values)}></Form>

我这样写, useEffect是不会触发的, 必须setState(JSON.parse(JSON.stringify(e.values)))才行

Additional information 补充说明

[pointhalo]

纯对象是什么……看不懂这个描述。 你描述的问题也跟入参是什么格式没有关系的……

[xmsz-stu]

纯对象是什么……看不懂这个描述。 你描述的问题也跟入参是什么格式没有关系的……

就是非引用对象，现在onChange里拿到的e.values是引用对象，如果其他地方更改了，这里也变化了 实际使用中就导致这个值不是实际表单的值

我现在只能先粗暴的深拷贝一下

[pointhalo]

onChange、onValueChange的回调就应该是 read only的，如果你要做write 操作，需要自己clone。

我们不会对这种事件回调的入参做作用域隔离。因为这个操作成本是非常高的，同时它的触发频次会非常高频，且用户无法决定是否触发，如果每次都做 deepClone部分场景这个性能损耗是用户无法承受的。

只有 formApi.getValues、getFormState这种可由用户主动触发的，才会在output 前主动做 deepclpne。

[xmsz-stu]

ok，问个额外的，我现在onChange里拿e.values,主要是为了在Form外部使用useEffect监听form的值。

const [state, setState] = useState();
   useEffect(()=>{
        // STEP: 处理相关的依赖
    },[state])

<Form onChange={(e) => setState(e.values)}></Form>

但是现在每次都要deepclone一次，确实不好，有没有其他方式解决？ 我看文档大部分都是子组件获取父Form组件的state

然后其他项目好像都是通过useWatch来解决

[pointhalo]

1. 为什么要额外再用一个 useEffect，不能直接监听后执行Step原因是什么？
2. 要不你先看看 onValueChange 和onChange的区别？如果你单纯是希望值变更后做一些操作，似乎你更需要的是onValueChange

[xmsz-stu]

1. 为什么要额外再用一个 useEffect，不能直接监听后执行Step原因是什么？
2. 要不你先看看 onValueChange 和onChange的区别？如果你单纯是希望值变更后做一些操作，似乎你更需要的是onValueChange

1. useEffect只是举例，form的里面的值影响外部的显隐或者计算，作为依赖值
2. 用onChange是其他组件库的习惯和偷懒覆盖全部状态