zoukankan      html  css  js  c++  java
  • antd中的form表单 initialValue导致数据不更新问题

    初步理解 : initialValue就是所谓的defaultValue,只会在第一次赋值的时候改变,却又有一些不同,因为 initialValue又会因其他改动而改变。 然而当获取的数据重新上来要渲染的时候 ,initialValue的值却又不改变,所以 让人觉得很是捉摸不透。

    解决:````this.props.form.resetFields();```

    例:如果第一步操作执行的是修改操作,一些默认值填充上去,如果不作处理,第二部执行新增操作的时候,会把第一个默认的值带着,导致新增弹框弹出来的时候form表单中就是数值,效果体验特别不好,

    后面发现在Modal文件里面添加componentWillReceiveProps中处理报表重置,就可以刷新form表单

    componentWillReceiveProps(nextProps) {
        if (!nextProps.modal.modalUpdateDetail) {
          this.props.form.resetFields();
        }

    后来还是会在同样的坑里面跳 但这回不是在Modal里的Form,而是在类似TAB组件切换数据的时候,this.state的内容变了,但是render的initialValue还是保留着原来的数据 解决方法 1 我第一想到的是强制刷新,window.location.reload() 但这样的办法并不是理想的效果

    2 治根还得治本,我知道是initialValue的问题 但如果参考原来的在componentWillReceiveProps里面重置表单数据,会出现其他各种问题,因为```componentWillReceiveProps``这个函数你可能因为别的原因触发了

    componentWillReceiveProps(nextProps) {
        if (!nextProps.modal.modalUpdateDetail) {
          this.props.form.resetFields();
        }

    后来想着,既然是因为initialValue已经有了初始化,那在切换操作的时候,将它清除掉好了,所以在离开的操作函数里添加 了 this.props.form.resetFields();


    作者:sbwxffnhc
    链接:https://juejin.im/post/5c67e01651882562a12ad79b
    来源:掘金
    著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。



  • 相关阅读:
    ABAP中的‘多线程’
    SAP数据库表维护视图分配事务代码
    SAP调用外部数据库
    ABAP-小技巧/知识(1)
    sap中用函数增加断点(break point)
    把内表 itab1 的 n1 到 n2 行内容附加到 itab2 内表中去.
    ABAP打开TCODE
    查看用户下有那些事务码
    check、continue、exit的区别
    将excel数据导入内表的函数
  • 原文地址:https://www.cnblogs.com/lanshu123/p/10966395.html
Copyright © 2011-2022 走看看