在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. C++基础--结构体声名

    struct是一种数据结构,当需要存储的相关数据为一个集合时,struct是很好的选择;例如,当存储student,学生的学号, 名字,年龄,身高,就构成了一个集合,用stuct声名为: typede ...

  2. SharePoint 2013 - Client Side Rendering

    1. Client side rendering 代码结构为: (function () { // Create object that have the context information ab ...

  3. 生成对抗式网络 GAN的理解

    转自:https://zhuanlan.zhihu.com/p/24767059,感谢分享 生成式对抗网络(GAN)是近年来大热的深度学习模型.最近正好有空看了这方面的一些论文,跑了一个GAN的代码, ...

  4. SharePoint Config database Log file too big – reduce it!

    SharePoint Config database logs are one thing to keep an eye on since they do have a tendency to gro ...

  5. ASP.NET中引用dll“找不到指定模块"的完美解决办法 z

    DllImport是System.Runtime.InteropServices命名空间下的一个属性类,其功能是提供从非托管DLL导出的函数的必要调用信息.DllImport属性应用于方法,要求最少要 ...

  6. 猿创|有赞的zan framework安装与使用

    1.准备工作 1.1 一台腾讯云服务器2核CPU+2G内存的Linux CentOS 7.2(谢谢小杨同学@erchoc) 1.2 预装lnmp一键安装包环境,官方地址:lnmp一键安装包 (如不会使 ...

  7. 收放卷及张力控制 PID调试技巧

    1) 小 Kp( 0.01) , 大 Ti ( 20000ms) 2)逐渐增大Kp, 减小Ti ( 20000ms – 3000ms),避免发生震荡 3)观察I-out 是否在0附近 可能原因:卷径不 ...

  8. Linux下elk安装配置

    安装jdkJDK版本大于1.8 elk下载地址:https://www.elastic.co/products注意:elk三个版本都要保持一致. rpm -ivh elasticsearch-5.4. ...

  9. react中虚拟dom的diff算法

    .state 数据 .jsx模板 .生成虚拟dom(虚拟DOM就是一个js对象,用它来描述真实DOM) ['div', {id:'abc'}, ['span', {}, 'hello world']] ...

  10. 学大伟业 Day 5 培训总结

    今天讲数据结构 先从mzx大佬的ppt摘抄一段: 数据结构是计算机存储.组织数据的方式.数据结构是指相互之间存在一种或多种特定关系的数据元素的集合. 通常情况下,精心选择的数据结构可以带来更高的运行或 ...