$set是Vue.js的一個全局API,用于動態添加或修改Vue實例中的屬性。在Vue 2.0版本中,$set的使用方式比Vue 1.0有所改變。
Vue 1.0版本中,$set的使用方式是:
Vue.set(vmObj, 'propertyName', value);
其中,vmObj是一個Vue實例,propertyName是要添加/修改的屬性名,value是要添加/修改的屬性值。
而在Vue 2.0版本中,$set的使用方式是:
vmObj.$set(propertyName, value);
這里的vmObj也是Vue實例,但是$set是作為其中一個實例方法使用的,而不是全局API。
為什么要使用$set呢?這是因為Vue.js文檔中有一個重要的限制:在創建Vue實例時,如果沒有提前聲明某個屬性,Vue將無法為該屬性添加雙向綁定功能。比如以下代碼:
new Vue({
data: {
msg: 'Hello Vue!'
}
});
在上述代碼中,msg屬性被聲明為Vue實例的data屬性,可以在HTML模板中被雙向綁定使用。但是如果直接修改msg屬性的另一個屬性,比如length,Vue將會無法更新對應的DOM元素:
vm.msg.length = 3; // Vue無法更新DOM
這時候,就可以使用$set方法來添加新屬性或修改已有屬性:
vm.$set(vm.msg, 'length', 3); // Vue可以更新DOM
總結一下,$set是Vue.js的全局API,用于動態添加或修改Vue實例中的屬性。在Vue 2.0版本中,$set的使用方式變為vm.$set(propertyName, value)。