vue $set修改对象
生活随笔
收集整理的這篇文章主要介紹了
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?');?
轉載于:https://www.cnblogs.com/qing619/p/8862282.html
總結
以上是生活随笔為你收集整理的vue $set修改对象的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 混合开发的坑(7) ---输入文本时,键
- 下一篇: Day8 字符串操作