Вот как это делать согласно лучших практик:
<template>
<div>
<!-- В шаблоне не вызывают какие-либо функций. Только выводят готовые значения -->
{{localeDate}}
</div>
</template>
<script>
{
data: () => ({
// Дата хранится в виде числа. Не обязательно в state компонента. Но и в других местах тоже
date: 1580558031264,
}),
computed: {
localeDate() {
// Конвертируем число в строку. Для этого существуют специальные методы
// toLocaleDateString() или toLocaleString() или toLocaleTimeString()
// Итоговая строка будет зависеть от локализации системы пользователя.
// Для русской локали это будет "01.02.2020",
// для американской "2/1/2020",
// для немецкой — "1.2.2020"
// Вы НЕ должны устанавливать формат даты самостоятельно
return (new Date(this.date)).toLocaleDateString()
},
},
// Если нужно изменять дату в реальном времени вешаем таймер
created() {
this.intervalId = setInterval(() => this.date = Date.now(), 1000); // Обновляем значения не чаще раза в секунду. А то и реже.
},
// Если повесили таймер, то его нужно отключать
beforeDestroy() {
if (this.intervalId) clearInterval(this.intervalId)
},
}
</script>
