@wakenby

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

Создал компонент уведомлений, в который приходит массив сообщений, они выводятся, и через 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()
    }
  }
}
  • Вопрос задан
  • 82 просмотра
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
суть вопроса, можно ли обойтись без computed свойства, для получения длины получаемого массива в watch?

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

watch: {
  'notifications.length'(newValue, oldValue) {
    ...
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы