#vue.js
#vue.js
Вопрос:
У меня есть список, который я просматриваю, и каждый элемент имеет временную метку unix. У меня есть функция для преобразования метки времени, но я не уверен, как использовать это встроенное с Vue.
<div
v-for="(product,index) in products"
:key="`product-${index}`"
class="product">
<div class="container">
{{this.formatTime(1555531395)}}
</div>
</div>
formatTime: function(timestamp) {
return "testing"
}
Комментарии:
1. formatTime должен быть фильтром: vuejs.org/v2/guide/filters.html
Ответ №1:
Вам просто не нужно this
. Ваш v-for
атрибут изменяет контекст в дочерних элементах на include product
(и index
) . Таким образом, вы можете сделать:
{{formatTime(product.timestamp)}}
Предположение timestamp
— это свойство элементов в products
массиве. Также, конечно, при formatTime
условии, что функция правильно определена в методах компонента Vue: https://v1.vuejs.org/guide/events.html
Комментарии:
1. Синтаксис предполагает, что это vue2 —
key
не был представлен доvue2
тех пор, пока не покажется
Ответ №2:
Я предпочитаю способ с пользовательским фильтром:
Vue.filter('formatDate', function(timestamp) {
var date = new Date(timestamp * 1000);
return date.toLocaleDateString("en-US"); // or other format.
})
где yourDateFormatFunction
, конечно, функция, которую вы используете для форматирования метки времени.
Затем в вашем шаблоне:
<div class="container">
{{ product.timestamp | formatDate }}
</div>