在vue开发中，当生成vue实例后，再次给数据赋值时，有时候并不会自动更新到视图上去；

eg:<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>vue $set的使用</title>

<script src="https://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>

</head>

<body>

<div id="app">

  姓名：{{ name }}<br>

    手机：{{phone}}<br>

    性别：{{sex}}<br>

    说明：{{list.instr}}

</div>

<script>

var data = {

    name: "简书",

    phone: '15736882244',

    list: {

        instr: 'my name is Yilia'

    }

}    
//var key = 'instr';var vm = new Vue({

    el:'#app',

    data: data,

    ready: function(){
　　　　//Vue.set(data,'sex', '男'); 
　　　　//this.$set('list.'+key, 'who are you?');
　　}

});

data.sex = '女'；

</script>

</body>

</html>

这样运行的结果是

姓名：简书

年龄：15736882244

性别：

说明：my name is Yilia

解决方法是：

Vue.set(data,'sex', '男')

还可以使用 vm.$set实例方法，这也是全局 Vue.set方法的别名:

var key = 'instr'; //这种主要用于当对象中某个属性值动态生成时处理方式

this.$set('list.'+key, 'who are you?');

 或

this.$set('list.instr', 'who are you?');

vue $set修改对象的更多相关文章

  1. [Effective JavaScript 笔记]第48条：避免在枚举期间修改对象

    注册列表示例 一个社交网络有一组成员,每个成员有一个存储其朋友信息的注册列表. function Member(name){ this.name=name; this.friends=[]; } va ...

  2. 3、ObjectARX开发创建直线、圆、圆弧和修改对象属性

    一.本节课程 Arx二次开发创建直线.圆.圆弧和修改对象属性 二.本节要讲解的知识点 1.如何应用C++ ARX二次开发创建直线. 2.如何应用C++ ARX二次开发创建圆. 3.如何应用C++ AR ...

  3. JQuery修改对象的属性值

    JQuery修改对象的属性值 用到的便是JQuery提供的attr方法,获取属性值的基本结构为:$(obj).attr("属性名"):修改属性值的结构为:$(obj).attr(& ...

  4. eclipse 中main()函数中的String[] args如何使用？通过String[] args验证账号密码的登录类？静态的主方法怎样才能调用非static的方法——通过生成对象？在类中制作一个方法——能够修改对象的属性值？

    eclipse 中main()函数中的String[] args如何使用? 右击你的项目,选择run as中选择 run configuration,选择arguments总的program argu ...

  5. promise 里面的 console.info 打印信息 并不准确，后期有修改对象数据，会覆盖，影响之前的显示

    promise 里面的 console.info 打印信息 并不准确,后期有修改对象数据,会覆盖,影响之前的显示

  6. 微信小程序中如何使用setData --- 修改数组对象、修改对象

    看代码吧~ 这是修改对象 this.setData({ allStageIndex: e.detail.value, [`projectDetailsData.stage`]: this.data.a ...

  7. ES6拓展符修改对象

    // ES6 拓展符合并两个对象let ab = { ...a, ...b }; // 等同于 let ab = Object.assign({}, a, b); // 修改对象部分属性.用户自定义的 ...

  8. vue修改对象的属性值后页面不重新渲染

    原文地址:vue修改对象的属性值后页面不重新渲染 最近项目在使用vue,遇到几次修改了对象的属性后,页面并不重新渲染,场景如下: HTML页面如下: [html] view plain copy &l ...

  9. [Web 前端 ] Jquery attr()方法 获取或修改 对象的属性值

    cp from : https://blog.csdn.net/gf771115/article/details/18086707 jquery中用attr()方法来获取和设置元素属性,attr是at ...

  10. EF中修改对象的值的问题。。。(字段超级多的时候)

    一般EF中修改单个对象的值,我是这样处理的. 如:DBEntities db=new DBEntities(); student stu = db.student.firstOrdefault(m=& ...

随机推荐

  1. spring学习（四）spring 持久层的封装

    持久层:所谓“持久层”,也就是在系统逻辑层面上,专著于实现数据持久化的一个相对独立的领域(Domain),是把数据保存到可掉电式存储设备中.持久层是负责向(或者从)一个或者多个数据存储器中存储(或者获 ...

  2. oozie fork join结点

    oozie可以用fork和join节点进行多任务并行处理,同时fork和join也是同时出现,缺一不可. 语法: <workflow-app name="[WF-DEF-NAME]&q ...

  3. 用批处理在windows中导出/导入无线网络信息，复制保存为bat即可

    @echo offtitle 在windows中导出/导入无线网络信息 :Beginecho ========================echo 请选择操作:echo 1 查看可用的无线网络ec ...

  4. NodeJS服务器端平台实践记录

    [2015 node.js learning notes]by lijun 01-note Nodejs是服务器端的javascript,是一种单线程.异步I/O.事件驱动型的javascript:其 ...

  5. 特殊权限的介绍 SGID SUID SBIT

    Set UID 当s这个标志出现在文件所有者的x权限上时,如/usr/bin/passwd这个文件的权限状态:“-rwsr-xr-x.”,此时就被称为Set UID,简称为SUID.那么这个特殊权限的 ...

  6. HDU 5536 字典树

    题意:就是公式. 这现场赛O(n^3)能过,觉得太没天理了. 做法:字典树,枚举两个数,然后在字典树上贪心的跑. #include <bits/stdc++.h> using namesp ...

  7. Gym 101308I Inspection

    题意: 用最少的路径,覆盖掉所有的边,(点可以重复): 不是用最小路径覆盖,最小路径覆盖是覆盖点: 分析: 建图:入度<出度,说明这是个起点,从这里出发,入度>出度,说明从这里结束: 先找 ...

  8. Manacher算法模板

    题目描述 给出一个只由小写英文字符a,b,c...y,z组成的字符串S,求S中最长回文串的长度. 字符串长度为n 输入输出格式 输入格式: 一行小写英文字符a,b,c...y,z组成的字符串S 输出格 ...

  9. javaw.exe 和java.exe的区别

    1.java启动的程序是命令行程序或阻塞程序,如果该程序未执行完毕或未被关闭,则所打开的命令行将被阻塞,不能执行其它命令如dir等,可以通过Ctrl+C等方式关闭程序:2.javaw启动的程序是窗口程 ...

  10. XCode项目配置可访问 非 https 接口的方法

    打开项目的info.plist文件,右键- open as sourceCode .在代码中添加: <key>NSAppTransportSecurity</key> < ...