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

我需要做的就是下面的Email和Fax属性的值从第一排的输入框用户输入获取,但是输入过后下面的文本框的值并为发生变化,在浏览器console却发现值已经改变了,这让我很郁闷,网上搜了一堆答案都没有解决,后面查看vue官网有个delete方法,如果我先把这个属性delete再重新set是否可以,如图:
 
                图1.第一排控件的代码
 
  图2.第一排控件方法代码
 
图3.最终解决代码
 
好啦 今天就写到这 希望能帮到你们 博客仅为日常学习和交流使用 如有不正确的地方 请指正
 
 
 
 
 

巧妙解决vue2.0关于set添加属性后视图不能更新的问题的更多相关文章

  1. vue2.0关于添加属性后视图不能更新的问题

    属性赋值和this.$set 和vue.$set方法我不行 可以用 this.$delete来进行删除后在设置都可以了

  2. cookie工具类,解决servlet3.0以前不能添加httpOnly属性的问题

    最近在解决XSS注入的问题,由于使用的servlet版本是2.5,不支持httpOnly的属性,故做了个工具类来实现cookie的httpOnly的功能.全类如下: /** * cookie工具类,解 ...

  3. 如何解决vue2.0 打包之后 打开index.html出现空白页

    如何解决vue2.0 打包之后 打开index.html出现空白页 1.打包之前修改三个文件       1.1.第一步,找到build文件,在webpack.prod.conf.js 第25行左右 ...

  4. vue2.0动态绑定图片src属性值初始化时报错

    在vue2.0中,经常会使用类似这样的语法 v-bind:src = " imgUrl "(缩写 :src = " imgUrl "),看一个案例 <te ...

  5. vue2.0 — 移动端的输入框实时检索更新列表

    我们都是行走在这世界的孤独者 - 暖暖 最近在做vue2.0的项目遇到一个移动端实事检索搜索更新列表的效果,但用户在搜索框输入客户的电话或姓名的时候,客户列表内容会做相应的更新,下面给大家看下图~· ...

  6. vue2.0中的计算属性

    计算属性是一个很邪门的东西,只要在它的函数里引用了data中的某个属性,当这个属性发生变化的时候,函数仿佛可以嗅探到这个变化,并自动重新执行. 上代码会源源不断的打印出a的值.如果希望b依赖data中 ...

  7. Vue2.0 -- 钩子函数/ 过度属性/常用指令/以及Vue-resoure发送请求

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

  8. 解决vue2.0路由 TypeError: Cannot read property 'matched' of undefined 的错误问题

    刚开始使用vue-router2.0,虽然也用了vux,用起来却发现一个问题--具体如下: 正常情况下使用脚手架跑完之后,然后修改源项目,首先在main.js入口里把该import进去的vuex,vu ...

  9. vue2.0之监听属性的使用心得及搭配计算属性的使用

    我们在工作中常常需要监听某一个属性值的变化,这个时候我们就需要用到了监听属性watch,在这里我总结watch属性的三种场景使用希望对你有所帮助: 1.基础版监听: 场景如下:输入框输入你的年龄,如果 ...

随机推荐

  1. C#找不到ConfigurationManager类

    c#添加了Configuration;后,竟然找不到 ConfigurationManager 这个类,后来才发现:虽然引用了using System.Configuration;这个包,但是还是不行 ...

  2. jQuery倒计时组件(jquery.downCount.js)

    //html <span class="days">00</span> <span class="hours">00< ...

  3. python从入门到实践-10章文件和异常(括号问题)

    #!/user/bin/env python# -*- coding:utf-8 -*- # 1.从文件中读取数据with open('pi_digits.txt') as file_object: ...

  4. [转]Understanding OpenStack Authentication: Keystone PKI

    The latest stable release of OpenStack, codenamed Grizzly, revolutionizes the way user authenticatio ...

  5. emWin录音机,含uCOS-III和FreeRTOS两个版本

    第12期:录音机配套例子:V6-921_STemWin提高篇实验_录音机(uCOS-III)V6-922_STemWin提高篇实验_录音机(FreeRTOS) 例程下载地址: http://forum ...

  6. 开源播放器 ijkplayer (六) :Android 下使用 ijkplayer 异常处理思路

    一. java.lang.IllegalStateException: mpjni: setOptionLong: null mp 根据已查到的资料看,目前是ijk内部的问题,只能通过try& ...

  7. Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖

    什么是ui-router ui-router是AngularUI库最有用的组件之一(AngularUI库由AngularJS社区构建).它是一个第三方路由框架,允许通过状态机制组织接口,而不是简单的U ...

  8. [Swift]LeetCode5. 最长回文子串 | Longest Palindromic Substring

    Given a string s, find the longest palindromic substring in s. You may assume that the maximum lengt ...

  9. [Swift]LeetCode118. 杨辉三角 | Pascal's Triangle

    Given a non-negative integer numRows, generate the first numRows of Pascal's triangle. In Pascal's t ...

  10. [Swift]LeetCode261.图验证树 $ Graph Valid Tree

    Given n nodes labeled from 0 to n - 1 and a list of undirected edges (each edge is a pair of nodes), ...