vue2.0中set添加属性后视图不能更新的解决办法


Posted in Javascript onFebruary 22, 2019

今天在工作中遇到一个问题,郁闷了很久,特地写一篇博客记录一下,方便以后再遇到可以查找,也分享个各位小伙伴,在网上查找很多资料说用Vue.$set设置属性后视图也会更新,但是真相并不是这样,通过等于号赋值和$set方法我都试了,前台属性值改变但是视图并没有改变,下面上图:

vue2.0中set添加属性后视图不能更新的解决办法

我需要做的就是下面的Email和Fax属性的值从第一排的输入框用户输入获取,但是输入过后下面的文本框的值并为发生变化,在浏览器console却发现值已经改变了,这让我很郁闷,网上搜了一堆答案都没有解决,后面查看vue官网有个delete方法,如果我先把这个属性delete再重新set是否可以,如图:

vue2.0中set添加属性后视图不能更新的解决办法

图1.第一排控件的代码

vue2.0中set添加属性后视图不能更新的解决办法

 图2.第一排控件方法代码

vue2.0中set添加属性后视图不能更新的解决办法

图3.最终解决代码

好啦 今天就写到这 希望能帮到你们 博客仅为日常学习和交流使用 如有不正确的地方 请指正

以上就是相关的解决办法总结,感谢大家对三水点靠木的支持。

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(2)
Dec 23 Javascript
js 模拟气泡屏保效果代码
Jul 10 Javascript
js单例模式的两种方案
Oct 22 Javascript
js图片延迟技术一般的思路与示例
Mar 20 Javascript
js选择并转移导航菜单示例代码
Aug 19 Javascript
javascript针对cookie的基本操作实例详解
Nov 30 Javascript
移动端脚本框架Hammer.js
Dec 15 Javascript
JS弹性运动实现方法分析
Dec 15 Javascript
纯JS实现表单验证实例
Dec 24 Javascript
Node.js安装配置图文教程
May 10 Javascript
react高阶组件经典应用之权限控制详解
Sep 07 Javascript
JavaScript实现下拉列表
Jan 20 Javascript
浅谈Node框架接入ELK实践总结
Feb 22 #Javascript
vue工程全局设置ajax的等待动效的方法
Feb 22 #Javascript
JavaScript数据结构与算法之检索算法示例【二分查找法、计算重复次数】
Feb 22 #Javascript
详解基于iview-ui的导航栏路径(面包屑)配置
Feb 22 #Javascript
JavaScript数据结构与算法之检索算法实例分析【顺序查找、最大最小值、自组织查询】
Feb 22 #Javascript
Fundebug支持监控微信小程序HTTP请求错误的方法
Feb 21 #Javascript
用Fundebug插件记录网络请求异常的方法
Feb 21 #Javascript
You might like
攻克CakePHP系列二 表单数据显示
2008/10/22 PHP
php 保留小数点
2009/04/21 PHP
php生成图片验证码的实例讲解
2015/08/03 PHP
php 类中的常量、静态属性、非静态属性的区别
2017/04/09 PHP
Laravel 5.5官方推荐的Nginx配置学习教程
2017/10/06 PHP
PHP实现按之字形顺序打印二叉树的方法
2018/01/16 PHP
PHP内部实现打乱字符串顺序函数str_shuffle的方法
2019/02/14 PHP
jquery中子元素和后代元素的区别示例介绍
2014/04/02 Javascript
Javascript基础教程之switch语句
2015/01/18 Javascript
JS显示表格内指定行html代码的方法
2015/03/31 Javascript
JS实现兼容性好,带缓冲的动感网页右键菜单效果
2015/09/18 Javascript
浅谈js的url解析函数封装
2016/06/28 Javascript
JQuery实现动态操作表格
2017/01/11 Javascript
Vue数据驱动模拟实现4
2017/01/12 Javascript
判断横屏竖屏(三种)
2017/02/13 Javascript
Vue.js中关于侦听器(watch)的高级用法示例
2018/05/02 Javascript
通过实例学习React中事件节流防抖
2019/06/17 Javascript
vue+render+jsx实现可编辑动态多级表头table的实例代码
2020/04/01 Javascript
vue cli4下环境变量和模式示例详解
2020/04/09 Javascript
Python open读写文件实现脚本
2008/09/06 Python
Python中正则表达式的用法实例汇总
2014/08/18 Python
python下调用pytesseract识别某网站验证码的实现方法
2016/06/06 Python
Python字典循环添加一键多值的用法实例
2019/01/20 Python
Python远程视频监控程序的实例代码
2019/05/05 Python
基于python实现雪花算法过程详解
2019/11/16 Python
python 如何去除字符串头尾的多余符号
2019/11/19 Python
python GUI库图形界面开发之PyQt5输入对话框QInputDialog详细使用方法与实例
2020/02/27 Python
css3遮罩层镂空效果的多种实现方法
2020/05/11 HTML / CSS
澳大利亚最好的在线时尚精品店:Princess Polly
2018/01/03 全球购物
小区门卫工作职责
2013/12/14 职场文书
餐饮管理自我介绍信
2014/01/15 职场文书
小学数学国培感言
2014/03/10 职场文书
企业党员一句话承诺
2014/05/30 职场文书
个人借款协议书范本
2014/11/17 职场文书
2016入党积极分子考察评语
2015/12/01 职场文书
Golang实现可重入锁的示例代码
2022/05/25 Golang