Ревью миксина Nuxt

В миксине добавляется глобальный resize-обработчик, но нет его удаления. После уничтожения компонента это может оставить лишнюю подписку.

Короткий ответ

Что ответить на собеседовании

В миксине добавляется глобальный resize-обработчик, но нет его удаления. После уничтожения компонента это может оставить лишнюю подписку.

Подробный разбор

Ответ с пояснениями

Условие

Ревью миксина Nuxt 2 - слушатель ресайза

export default {
  data() {
    return { width: 0 }
  },

  mounted() {
    window.addEventListener('resize', this.onResize)
    this.onResize()
  },

  methods: {
    onResize() {
      this.width = window.innerWidth
    }
  }
}

Ответ

В миксине добавляется глобальный resize-обработчик, но нет его удаления. После уничтожения компонента это может оставить лишнюю подписку.

Для Nuxt 2/Vue 2 добавьте очистку той же ссылкой на метод:

beforeDestroy() {
  window.removeEventListener('resize', this.onResize);
}

Для Vue 3 используется beforeUnmount/unmounted. Обращение к window внутри mounted безопаснее для SSR, чем на уровне модуля. Начальный вызов onResize нужен для текущей ширины; при множестве потребителей лучше общий источник состояния.

ИИ-помощник для собеседований

Хочешь уверенно проходить собеседования?

Попробуй ИИ-помощник для собеседований: слышит вас и собеседника, анализирует экран, подсказывает ответы в реальном времени, работает без VPN и не попадает в захват экрана.

Подробнее