如何在 vuecli 中使用 Moment.js [英] How to use Moment.js in vuecli
问题描述
我在 npm 上安装了 vue-moment.我需要通过 for 循环将日期传递给 p 标签.另外我需要创建一个方法,我可以在其中添加天数到我的日期,以便它会在该天数之后确定日期.我该怎么做或我哪里错了
main.js 代码:
Vue.use(require("vue-moment"));
vuecomponent 代码:
<div><div><span>{{ new Date() |时刻(MM.DD.YY")}}</span>
<p v-for="打印数据中的数据" :key="data.index" v-html="data.name"></p>
模板><脚本>导出默认{数据() {返回 {打印数据:[{名称:paraone"},{name: "<span>{{ new Date() | moment('MM.DD.YY') }}</span>"},{名称:parathree"},{名称:parafour"}]};},组件: {},方法: {更改日期:函数(){var todaydate = new Date();时刻(今天).格式(YYYY-MM-DD");this.printdata[0].name = 今天日期;}},创建(){this.changeDate();}};<style lang="scss" 作用域></style>
div 标签中的一个按预期工作,但如何在第二个 p 标签中获取日期?
我知道我错在哪里了.我没有在组件的脚本标签中导入时刻.我必须这样做
现在工作正常.
I have npm installed vue-moment. I need to pass date to p tag via for loop. Also I need to create a method where i can add number of days to my date so that it will shoe the date after that number of days. How do i do it OR where am I wrong
main.js code:
Vue.use(require("vue-moment"));
vuecomponent code:
<template>
<div>
<div>
<span>{{ new Date() | moment("MM.DD.YY") }}</span>
</div>
<p v-for="data in printdata" :key="data.index" v-html="data.name"></p>
</div>
</template>
<script>
export default {
data() {
return {
printdata: [
{
name: "paraone"
},
{
name: "<span>{{ new Date() | moment('MM.DD.YY') }}</span>"
},
{
name: "parathree"
},
{
name: "parafour"
}
]
};
},
components: {},
methods: {
changeDate: function() {
var todaydate = new Date();
moment(todaydate).format("YYYY-MM-DD");
this.printdata[0].name = todaydate;
}
},
created() {
this.changeDate();
}
};
</script>
<style lang="scss" scoped></style>
The one in div tag is working as expected but how do i get date in second p tag?
I got to know where I was wrong. I had not imported moment in the script tag of component. I had to do this
<script>
import * as moment from "moment/moment";
export default {
data() {
return {
printdata: [
{
name: "paraone"
},
{
name: "<span>{{ new Date() | moment('MM.DD.YY') }}</span>"
},
{
name: "parathree"
},
{
name: "parafour"
}
]
};
},
methods: {
changeDate: function() {
var todaydate = new Date();
moment(todaydate).format("YYYY-MM-DD");
this.printdata[0].name = todaydate;
}
},
created() {
this.changeDate();
}
};
</script>
and now its working fine.
这篇关于如何在 vuecli 中使用 Moment.js的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!