Вычисляемые свойства (Computed)
Например, если мы перечислим имя и фамилию, используя только данные, список может выглядеть следующим образом.
Если у нас есть данные, которые мы хотим «вычислить» из других данных, мы можем использовать только что вычисленные. Например, чтобы объединить имя и фамилию в один, код может выглядеть следующим образом.
И здесь реактивная система работает правильно. Если вы измените имя или фамилию, результат будет отражен в nameSurname. Здесь мы использовали computed для простой комбинации имени и фамилии. Например, вы можете использовать Computed в Vue.js, чтобы добавить валюту для цены или отформатировать текст.
В примере также показано, как получить доступ к данным экземпляра Vue. Он использует ключевое слово this и точечную запись. Вычисление должно использоваться, чтобы уменьшить появление логики в HTML.
Методы наблюдатели (watch)
Может случиться так, что мы хотим изменить некоторые данные в зависимости от изменения других данных.
Например, мы хотим регистрировать каждое изменение имени в консоли. Использование может выглядеть следующим образом.
В этом примере были добавлены кнопка и метод changeName . Нажатие на эту кнопку вызывает этот метод, который только изменяет значение имени даты.
Наблюдатель имени включает функцию, которая выполняется всякий раз, когда обнаруживает изменение имени.