Vue中 this.$set的用法
阿新 • • 發佈:2021-01-21
Vue中this.$set的用法
Vue.set( target, propertyName/index, value )
引數
{Object | Array} target
{string | number} propertyName/index
{any} value
<template>
<div class="page" id="app">
<button @click="add">設定</button>
<ol>
< li v-for="(item, index) in arr" :key="index">{{ item.name }}</li>
</ol>
</div>
</template>
<script>
export default {
data() {
return {
arr: [
{ name: "Hanmeimei", age: 21 },
{ name: "Lilei", age: 21 },
],
};
},
mounted() {
this.arr[2] = { name: "小明", age: 23 }; //陣列的值發生了變化 但檢視沒有更改
},
methods: {
add() {
this.$set(this.arr, 2, { name: "小明", age: 23 }); //$set 觸發檢視更改
},
},
};
</script>
<style>
</style>