मेरे पास एक सरणी peopleहै, जिसमें ऑब्जेक्ट्स निम्नानुसार हैं:
इससे पहले
[
{id: 0, name: 'Bob', age: 27},
{id: 1, name: 'Frank', age: 32},
{id: 2, name: 'Joe', age: 38}
]
यह बदल सकता है:
उपरांत
[
{id: 0, name: 'Bob', age: 27},
{id: 1, name: 'Frank', age: 33},
{id: 2, name: 'Joe', age: 38}
]
नोटिस फ्रैंक सिर्फ 33 साल का हो गया।
मेरे पास एक ऐप है जहां मैं लोगों को सरणी देखने की कोशिश कर रहा हूं और जब कोई भी मान बदलता है तो परिवर्तन लॉग करें:
<style>
input {
display: block;
}
</style>
<div id="app">
<input type="text" v-for="(person, index) in people" v-model="people[index].age" />
</div>
<script>
new Vue({
el: '#app',
data: {
people: [
{id: 0, name: 'Bob', age: 27},
{id: 1, name: 'Frank', age: 32},
{id: 2, name: 'Joe', age: 38}
]
},
watch: {
people: {
handler: function (val, oldVal) {
// Return the object that changed
var changed = val.filter( function( p, idx ) {
return Object.keys(p).some( function( prop ) {
return p[prop] !== oldVal[idx][prop];
})
})
// Log it
console.log(changed)
},
deep: true
}
}
})
</script>
मैंने इस सवाल के आधार पर कहा कि मैंने कल सरणी तुलना के बारे में पूछा और सबसे तेज काम करने वाले उत्तर का चयन किया।
इसलिए, इस बिंदु पर मुझे इसका परिणाम देखने की उम्मीद है: { id: 1, name: 'Frank', age: 33 }
लेकिन सभी कंसोल में वापस मिल जाता है (यह ध्यान में रखते हुए कि मेरे पास एक घटक है):
[Vue warn]: Error in watcher "people"
(found in anonymous component - use the "name" option for better debugging messages.)
और मेरे द्वारा बनाए गए कोडपैन में , परिणाम एक खाली सरणी है और परिवर्तित वस्तु नहीं है जो कि बदल गई है जो कि मुझे उम्मीद थी।
अगर कोई सुझाव दे सकता है कि ऐसा क्यों हो रहा है या जहां मैं यहां गलत हो गया हूं तो यह बहुत सराहना की जाएगी, बहुत धन्यवाद!