Vue.js

# Обработка крайних случаев

Подразумевается, что уже изучили и разобрались с разделом Основы компонентов. Если нет — прочитайте его сначала.

Примечание

Возможности в этом разделе документируют обработку крайних случаев — необычных ситуаций, где требуется обойти некоторые правила Vue. Учтите, все они имеют недостатки или ситуации, когда могут быть опасными. Об этом отмечается в каждом случае, поэтому помните о них, когда собираетесь использовать какую-либо из этих возможностей.

# Контролирование обновлений

Благодаря системе реактивности, Vue всегда знает, если требуется выполнить обновление (при правильном использовании). Но есть крайние случаи, когда необходимо принудительное обновление, даже если никакие реактивные данные не изменились. Могут быть и другие случаи, когда требуется предотвращать ненужные обновления.

# Принудительное обновление

Если столкнулись с тем, что нужно принудительное обновление во Vue, то в 99.99% случаев где-то совершили ошибку. Например, полагаетесь на состояние, которое не отслеживается системой реактивности Vue, добавив новое свойство в data после создания компонента.

Но если все возможные варианты исключены и это та супер-редкая ситуация, где требуется принудительное обновление вручную, то это можно сделать с помощью $forceUpdate.

# Дешёвые статические компоненты с помощью v-once

Отрисовка простых HTML-элементов во Vue происходит очень быстро, но иногда бывают компоненты, в которых очень много статичного содержимого. В таком случае можно установить на корневом элементе директиву v-once, чтобы вычислить его один раз и потом закэшировать. Например так:

app.component('terms-of-service', {
  template: `
    <div v-once>
      <h1>Условия использования</h1>
      ... много-много статичного содержимого ...
    </div>
  `
})
1
2
3
4
5
6
7
8

Совет

Повторимся, старайтесь не злоупотреблять этим подходом. Хотя это и удобно в тех редких случаях, где нужно отрисовать много статичного содержимого, в этом нет потребности, если только действительно не заметили замедления в отрисовке — кроме того, это лишь добавит путаницы в будущем. Представьте себе разработчика, который не знаком с v-once или пропустил её применение в шаблоне. Можно потратить часы, разбираясь, почему шаблон корректно не обновляется.

← Обзор возможностей →