如何查看對象何時有新屬性

簡單問題：是否可以觀察何時將對象作爲新屬性？如何查看對象何時有新屬性

在的jsfiddle我只初始化列表中的第一項的屬性「秀」」。當我點擊‘切換’的第一個項目它的工作原理。

但對於其他項目（即獲得「秀」動態屬性）和myObject的（即獲得「test2的」屬性動態），它是當你切換列表的第一項只刷新！

在我來說，我想的是，切換立即生效。

有人有解釋嗎？

new Vue({ 
 
    el: "#app", 
 
    data: function() { 
 
    return { 
 
    \t myObject: { test: 'test' }, 
 
     list: [{ 
 
     value: 1, 
 
     show: true 
 
     }, { 
 
     value: 2 
 
     }, { 
 
     value: 3 
 
     }, { 
 
     value: 4 
 
     }, { 
 
     value: 5 
 
     }] 
 
    } 
 
    }, 
 
    methods: { 
 
    toggleItem: function(item) { 
 
    \t if(!item.show) item.show = true; 
 
    \t else item.show = !item.show; 
 
     console.log(item.show) 
 
     this.myObject.test2 = 'test2'; 
 
    } 
 
    }, 
 
    watch: { 
 
    \t list: function(newValue) { 
 
    \t console.log('NEW VALUE: ', newValue); 
 
    } 
 
    } 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.5/vue.js"></script> 
 

 
<div id="app"> 
 
{{ myObject }} 
 
    <div v-for="item in list"> 
 
    <span v-if="item.show"> 
 
     {{ item.value }} 
 
    </span> 
 
    <button @click="toggleItem(item)" type="button">Toggle !</button> 
 
    </div> 
 
</div>

來源

2017-03-28 SLYcee

所有屬性，我認爲你需要的是使用Vue.set：https://vuejs.org/v2/api /＃Vue-set – Potray

非常感謝你！ – SLYcee

爲了幫助Vue的拿起新的屬性，你必須使用Vue.set()/this.$set添加它們。否則，Vue無法檢測到添加，並且新屬性不會被動。

if(!item.show) this.$set(item, 'show', true)

https://vuejs.org/v2/api/#Vue-set

一般情況下，我們強烈建議預先設置在data()

來源

2017-03-28 10:02:19

如何查看對象何時有新屬性

回答

相關問題