我用momentjs。
在我的Vuujs代码中,我想从现在开始到过去的那个时间点。在我的模板中,我合并了这一小段javascript的结果:

<template>
  <div>{{ moment(message.createdAt, 'YYYYMMDD').fromNow() }}</div>
</template>

对象接收日期如下:
message: { createdAt: Date.now() }

结果总是:a few seconds ago
我怎样才能得到正确的结果(不总是“几秒钟前”):
编辑:
这是我的完整模板:
<template v-for="message in messages">
  <div class="message">
    <div class="text">{{ message.text }}</div>
    <div class="date">{{ moment(message.createdAt).format('D.M.YYYY') }}</div>
    <div class="date">{{ moment(message.createdAt).fromNow() }}</div>
  </div>
</template>

最佳答案

好吧,不能直接在模板中使用moment,因为它不是白框(模板中不可访问)。
模板表达式是沙盒式的,只能访问全局变量(如math和date)的白名单。不应尝试在模板表达式中访问用户定义的全局参数。
来源:https://vuejs.org/v2/guide/syntax.html#Using-JavaScript-Expressions
我建议您改用一些过滤器(您也可以使用非常类似的方法)。
这是一个有效的例子。

new Vue({
	el: "#app",
	data() {
		return {
			messages: [
				{
					text: 'Message1',
					createdAt: new Date() // Now
				},
				{
					text: 'Message2',
					createdAt: new Date(2016, 3, 1) // 1 April 2017
				}
			],
			interval: null
		};
	},
	filters: {
		format(date) {
			return moment(date).format('D.M.YYYY')
		},
		fromNow(date) {
			return moment(date).fromNow();
		}
	},
	created() {
		this.interval = setInterval(() => this.$forceUpdate(), 1000);
        // Trigger an update at least each second
        // You should probably raise this duration as refreshing so often
        // may be not useful
 		},
	beforeDestroy() {
		clearInterval(this.interval);
	}
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script>
<div id="app">

	<template v-for="message in messages">
	  <div class="message">
		<div class="text">{{ message.text }}</div>
		<div class="date">{{ message.createdAt | format }}</div>
		<div class="date">{{ message.createdAt | fromNow }}</div>
	  </div>
	</template>

</div>

关于vue.js - MomentJS + VueJS:从现在到过去的某个相对时间,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44304636/

10-11 13:01