vue js 遍历最小日期到最大日期中的每一天
时间: 2024-02-15 21:01:19 浏览: 121
可以使用Vue.js结合Moment.js 或 day.js 库来遍历最小日期到最大日期的每一天。以下是一个示例代码:
```html
<template>
<div>
<div v-for="date in dates" :key="date">{{ date }}</div>
</div>
</template>
<script>
import moment from 'moment'; // 或 import dayjs from 'dayjs';
export default {
data() {
return {
startDate: '2021-01-01',
endDate: '2021-01-10',
dates: [],
};
},
mounted() {
const start = moment(this.startDate);
const end = moment(this.endDate);
for (let m = start; m.diff(end, 'days') <= 0; m.add(1, 'days')) {
this.dates.push(m.format('YYYY-MM-DD'));
}
},
};
</script>
```
在这个示例中,我们定义了startDate和endDate两个数据属性,分别表示最小日期和最大日期。在mounted钩子函数中,我们使用Moment.js或day.js库的API来遍历日期范围内的每一天,并将格式化后的日期字符串添加到dates数组中。最后在模板中使用v-for指令遍历dates数组,生成日期列表。
阅读全文