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') 的形式），而减少数组长度则没有这个限制。

Vue中增加数组长度获得响应的问题

comments