KornevaViktoria
@KornevaViktoria
Frontend Developer

Как работать с периодами, используя moment.js?

Для работы с датами используется moment.js (сайт на vue.js).

Есть дропдаун с выбором промежутка времени (Пример: 2019, 2020, 2019-2020, 2018-2019, 2018-2020). После того, как нужный промежуток выбран, формируется объект с начальной и конечно датой этого периода:

currentYearPeriod: {
    endYear:"2020-01-01T05:00:00+05:00"
    startYear:"2019-01-01T05:00:00+05:00"
}

Далее эта информация передается в компонент календаря.

Целью является получить календарь по данному периоду (на странице будет, 12/24 или более карточек с месяцами (название, даты, дни недели)).

Как можно получить массив из объектов месяцев, входящих в заданный период? Пример:

months: [
    {
        name: 'Январь',
        year: '2019',
        days: [
            1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17,
           18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31,
         ],
    },
],
  • Вопрос задан
  • 294 просмотра
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
<input type="date" v-model="years.start">
<input type="date" v-model="years.end">
<div v-for="n in months">
  <h3>{{ n.year }}, {{ n.name }}</h3>
  <div>{{ n.days }}</div>
</div>

data: () => ({
  years: {
    start: null,
    end: null,
  },
}),
computed: {
  months() {
    const start = moment(this.years.start).startOf('month');
    const end = moment(this.years.end).endOf('month');
    const months = [];

    for (; start < end; start.add(1, 'day')) {
      const [ year, name, day ] = start.format('YYYY.MMMM.D').split('.');
      if (day === '1') {
        months.push({
          year,
          name,
          days: [],
        });
      }
      months[months.length - 1].days.push(+day);
    }

    return months;
  },
},
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы