Vue中增加数组长度获得响应的问题
最近在学习Vue的过程中遇到一个问题,[官方文档](由于 JavaScript 的限制,Vue 不能检测以下变动的数组)说由于 JavaScript 的限制,Vue 不能检测以下变动的数组:
当你修改数组的长度时,例如:
vm.items.length = newLength
解决方法是使用
vm.items.splice(newLength)
但我在使用的时候却没有作用。这是我的代码:
<div id="app">
<ol>
<li v-for="(item,index) in items">{{ index }} : {{ item }}</li>
</ol>
</div>
<script>
var app = new Vue({
el: '#app',
data: {
items: ['a', 'b', 'c']
}
})
</script
页面运行后,我在chrome的console中输入
app.items.splice(10)
页面没变化,重试几次都没效果,我猜测官方说的解决方法有问题,于是发了issue进行询问。最后得知:
splice() 增加数组的长度必须提供值(可为空,即使用 app.items.splice(3,0,'','','','g','h') 的形式),而减少数组长度则没有这个限制。
Congratulations @syt! You have received a personal award!
1 Year on Steemit
Click on the badge to view your Board of Honor.
Congratulations @syt! You received a personal award!
You can view your badges on your Steem Board and compare to others on the Steem Ranking
Vote for @Steemitboard as a witness to get one more award and increased upvotes!