在vue項(xiàng)目中$set的作用是什么

 姓名：{{ name }}

 年齡：{{age}}

 性別：{{sex}}

 說(shuō)明：{{info.content}}

運(yùn)行結(jié)果：

姓名：創(chuàng)新互聯(lián)
年齡：3
性別：
說(shuō)明：my name is test

為什么會(huì)這樣呢？當(dāng)去查對(duì)應(yīng)文檔時(shí)，你會(huì)發(fā)現(xiàn)響應(yīng)系統(tǒng) ,把一個(gè)普通 Javascript 對(duì)象傳給 Vue 實(shí)例來(lái)作為它的 data 選項(xiàng)，Vue 將遍歷它的屬性，用 Object.defineProperty 將它們轉(zhuǎn)為 getter/setter,如上示例，將data在控制臺(tái)打印出來(lái)會(huì)發(fā)現(xiàn)：

在age及name都有g(shù)et和set方法,但是在sex里面并沒(méi)有這兩個(gè)方法，因此，設(shè)置了sex值后vue并不會(huì)自動(dòng)更新視圖；

解決方法：

1、通過(guò)Vue.set方法設(shè)置data屬性，如上：

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

2、您還可以使用 vm.$set實(shí)例方法，這也是全局 Vue.set方法的別名:

var key = 'content'; //這種主要用于當(dāng)對(duì)象中某個(gè)屬性值動(dòng)態(tài)生成時(shí)處理方式
this.$set('info.'+key, 'what is this?');
//或
this.$set('info.content', 'what is this?');

上述內(nèi)容就是在vue項(xiàng)目中$set的作用是什么，你們學(xué)到知識(shí)或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。