问题代码:

const tempFieldsValue = this.form.getFieldsValue()
  Object.keys(tempFieldsValue).map((k) => {
  if(typeof(tempFieldsValue[k]) === 'string' && tempFieldsValue[k].indexOf('---') !== -1) {
    this.form.setFieldsValue({ k: undefined })
  }
})

原因是 “{ }”本身是一个 new Object() 的语法糖,如果写成{ k: undefined },k 将会被解析成一个新的键,等同于声明了一个新的变量,它不会指向map函数中的item.

setFieldsValue并非不生效,只是作用在了键为“ k ”的表单项中,我在HTML中增加了一个键为k的表单项,通过这行语句果然改变了这个表单项的值,

this.form.setFieldsValue({ [k]: undefined })

将第4行改成  [ k ] 来改变“ k ”的指向  ,使得它能获取到map( )函数item的值。


基础语法很重要

- END -

JS001. antd vue遍历setFieldsValue表单键值对无效 ( {} -> new Object() )的更多相关文章

  1. vue动态生成表单

    vue动态生成表单 一.下拉框 <!DOCTYPE html> <html> <head> <meta charset="utf-8" / ...

  2. antd+vue3实现动态表单的自动校验

    由于vue3用的人还不多,所以有些问题博主踩了坑只能自己爬出来了,特此做个记录.如有错误,请大家指正. 回归正题,我所做的业务是,动态添加表单项,对每一项单独做校验,效果如下: 主要代码如下: 1 & ...

  3. 【antd】form表单默认值设置

    问题: 在antd的form表单的api里面有个"initialValues"可以设置默认值.但是表单没有更新 <Form name="test" for ...

  4. 034——VUE中表单控件处理之使用vue控制radio表单的实例操作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象合并到总的对象,再提交

    vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象 ...

  6. vue+element 动态表单验证

    公司最近的项目有个添加动态表单的需求,总结一下我在表单验证上遇到的一些坑. 如图是功能的需求,这个功能挺好实现的,但是表单验证真是耗费了我一些功夫. vue+element在表单验证上有一些限制,必须 ...

  7. 【Vue】强化表单的9个Vue输入库

    一个设计不当的表单可能会使用户远离你的网站.幸运的是,对Vue开发者,有大量可用的Vue输入库让你轻松整理表单. 拥有直观而且对用户友好的表单有诸多好处,比如: 更高的转化率 更好的用户体验 更专业的 ...

  8. 【VUE】3.表单操作

    1. Form组件渲染 1. components -> 新增组件Form.vue <template> <div>表单验证</div> </templ ...

  9. 用jQuery获取表单的值

    在日常开发过程中,有许多用到表单的地方.比如登录,注册,比如支付,填写订单,比如后台管理等等. 使用jQuery来获取表单的值是比较常见的做法. 常见表单 单行文字域:<input type=' ...

随机推荐

  1. 防火墙和SElinux简单配置

    1.查看防火墙状态 # firewall-cmd --state          &    #systemctl status  firewalld.service 2.停止与开启firew ...

  2. 第1篇-关于JVM运行时,开篇说的简单些

    开讲Java运行时,这一篇讲一些简单的内容.我们写的主类中的main()方法是如何被Java虚拟机调用到的?在Java类中的一些方法会被由C/C++编写的HotSpot虚拟机的C/C++函数调用,不过 ...

  3. 这才是做了五年Android开发该有的样子!

    程序员工作五年后一般怎样了? 五年程序员生涯对身体上的摧残就不说了,来讲讲一般会有怎样的状态吧! 优秀的一般是这样:有着明确的职业目标与规划,热爱技术,五年的工作沉淀,技术能力得到了飞速提升,每天依然 ...

  4. k8s之Service详解-Service使用

    实验环境准备 在使用service之前,首先利用deployment创建出3个pod,注意要为pod设置app=nginx-pod的标签 创建deployment.yaml,内容如下 apiVersi ...

  5. 【剑指offer】65. 不用加减乘除做加法

    剑指 Offer 65. 不用加减乘除做加法 知识点:数学:位运算 题目描述 写一个函数,求两个整数之和,要求在函数体内不得使用 "+"."-"."* ...

  6. python数据统计之禅道bug统计

    背景 通过定期输出 每条产品的 BUG 情况,以此来反馈开发解决问题.测试跟进问题的情况:钉钉群推送提醒开发及时解决 以此我这边开始着手准备编写一个小工具,最终达到目的:自动定期发送统计报告,报告维度 ...

  7. Android系统编程入门系列之服务Service中的进程间通信

    在上篇文章以线程间的通信方式Handler类结尾,服务Service还支持的进程间通信,又是具体怎么实现的呢?这就要用到加载服务一文中提到的AIDL语言规范了. AIDL是 Android Inter ...

  8. 尝试通过 JDBC 将 UTF-8 插入 MySQL 时出现“乱码”

    这是我的连接设置方式: Connection conn = DriverManager.getConnection(url + dbName + "?useUnicode=true& ...

  9. Django 反向解析 request CBV

    正则路径中的分组 无名分组 分组的概念:就是给某一段正则表达式用小括号括起来 无名分组按位置传参数,一一对应. view中除去request,其他形参数量要与urls中分组数量一致. 无名分组就是将括 ...

  10. Xilinx约束学习笔记(一)—— 约束方法学

    <Xilinx约束学习笔记>为自己阅读 Xilinx 官方 UG903 文档后的学习笔记,大多数为翻译得来,方便大家学习. 1 约束方法学 1.1 组织约束文件 Xilinx 建议将时序约 ...