【vue】v-for 使用 Array.prototype.reverse() 的无限更新循环

v-for="item in items.reverse()"

[Vue 警告] 组件渲染函数中可能存在无限更新循环。infinite loop update

Array.prototype.reverse 实际上修改了它应用于 的数组.

Vue 获取此更改并同时触发 v-for重新评估,触发另一个 .reverse() .这会触发 Vue 重新渲染,导致 .reverse()

要解决此问题,请使用 computed items[] 的浅拷贝上的属性(例如,使用 Array 解构 […this.items] 作为反向列表:

computed: {
    itemsReverse() {
      return [...items].reverse()
    }
}

你可能感兴趣的:(Vue组件开发,vue.js,原型模式,javascript)