vue $set修改对象
在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?');
