当计算选项更改创建的 v-for 数组时，DOM 不会相应更改

Question

最近遇到一个问题，是vuejs的计算选项引起的。

首先，我使用 v-for 循环一个由计算选项创建的数组 (soloColImgs)。

我的HTML

  <div class="show-box" v-for="item in soloColImgs" track-by="$index">
                <img v-bind:src="item.imgUrl"/>
                <a v-bind:href="item.itemUrl" target="_blank"></a>
  </div>

我的 JS

   //...
   computed: {
   soloColImgs :function(){
           //....
    },

   methods: {
      change:function(){
              this.soloColImgs.pop();
           }
      }

其次，我使用 pop() 或 splice() 等更改数组 (soloColImgs)...当我查看控制台时，数组可以相应更改，但是 DOM 根本没有改变。如果有人能帮助我解决这个问题，那就太好了。

Answer 1

计算属性的要点在于它完全由定义它的函数决定。您不能直接更改它，您必须通过对依赖项进行操作来更改它。依赖项是用于计算返回值的属性。

当计算选项更改创建的 v-for 数组时，DOM 不会相应更改

When v-for array created by computed option changs, the DOM doesn't change accordingly

vue.js

computed-properties