Как в vue получить значение переменной в watch?

Question

[wakenby]

Создал компонент уведомлений, в который приходит массив сообщений, они выводятся, и через N - время удаляются, вот код:

export default {
  props: {
    notifications: {
      type: Array
    }
  },
  methods: {
    removeNotification () {
      setTimeout(() => {
        this.notifications.pop()
      }, 3000)
    }
  },
  computed: {
    notificationsLength () {
      return this.notifications.length
    }
  },
  watch: {
    notificationsLength (newValue, oldValue) {
      if (newValue > oldValue) this.removeNotification()
    }
  }
}

Суть в том что, при добавлении нового уведомления запускается setTimeout и удаляет через N - время последнее уведомление. Но watch срабатывает не только при добавлении из вне уведомления, но и при удалении. Пришлось искать выход, и написать computed свойство для получения информации о том, было ли добавлено уведомление.

И суть вопроса, можно ли обойтись без computed свойства, для получения длины получаемого массива в watch?

Пробовал так, но не работает:

export default {
  props: {
    notifications: {
      type: Array
    }
  },
  methods: {
    removeNotification () {
      setTimeout(() => {
        this.notifications.pop()
      }, 3000)
    }
  },
  watch: {
    notifications (newValue, oldValue) {
      if (newValue.length > oldValue.length) this.removeNotification()
    }
  }
}

Answer 1

[0xD34F]

суть вопроса, можно ли обойтись без computed свойства, для получения длины получаемого массива в watch?

Можно. Длину и отслеживайте:

watch: {
  'notifications.length'(newValue, oldValue) {
    ...