Vue.js 仅在特定数组更改时更新（）答案

【问题标题】：Vue.js updated() only when a specific array changesVue.js 仅在特定数组更改时更新（）
【发布时间】：2020-08-19 11:25:27
【问题描述】：

我目前正在聊天，想要一个在将数据添加到数组后向下滚动到 div 末尾的函数。

updated() 工作正常，但我们在组件中也有一个 vue-timepicker，它显示一个计时器，因此 $nextTick() 每秒执行一次，您无法向上滚动。

只有当带有消息的数组发生更改或任何其他想法时，如何执行$nextTick()？

updated() {
        this.$nextTick(() => this.scrollToBottom());
    },

【问题讨论】：

【解决方案1】：

您需要查看更改的确切属性

watch: {
  value(val) {
    // executes when value changes
    this.$nextTick(() => this.scrollToBottom());
  },
},

您可以在此处阅读更多相关信息https://vuejs.org/v2/api/#watch。

请注意，updated 不建议用于此用例：

要对状态变化做出反应，通常最好使用计算属性或观察器。

【讨论】：

【解决方案2】：

你可以 watch 像这样的数组：

watch:{
    arrName:{
      handler(newVal,oldVal){
          this.scrollToBottom()
      },
     deep:true

   }

}

【讨论】：