form.setFieldsValue不会触发change事件,自行触发

运用antd的form.setFieldsValue不会触发控件绑定的change事件,需要自行触发。

我的解决方案是,定义一个对象用来表示field字段值改变和其触发change事件的映射关系,

然后在执行form.setFieldsValue后触发遍历映射对象执行相应change方法,形如:

 import { isEmpty } from 'lodash'

 const nameChange = (o) => {
    console.log(o)
  }
 const ageChange = (o) => {
    console.log(o)
  }
 //key:字段名,value:字段映射的change方法
 const changeMap = {
    name:nameChange,
    age:ageChange,
 }
  /** 
  /** 
 * 此方法旨在调用form.setFieldsValue时无法触发控件的change事件,遍历映射对象,手动触发对应change
 * @param obj 传给setFieldsValu的对象 
 * @param changeMap 控件值改变所对应的唯一change映射 
 */ 
  const triggerChange = (obj, changeMap)=>{ 
    if (isEmpty(obj)||isEmpty(changeMap)) return '' 
    let keys = Object.keys(obj) 
    for(let i in changeMap){ 
      if(!(keys.indexOf(i)<0)){ 
        changeMap[i](obj[i]) 
      } 
    } 
  }
  useEffect(()=>{
    let obj = { 
      name:'石乐志', 
      age:'18' 
    } 
    form.setFieldsValue(obj) //表单设置值
    triggerChange(obj,changeMap)//触发映射
  },[])

有别的处理方式也可以给我推荐一下~

posted @ 2021-11-24 11:41  你风致  阅读(4830)  评论(0编辑  收藏  举报