mengxiong10 / vue2-datepicker

A datepicker / datetimepicker component for Vue2
https://mengxiong10.github.io/vue2-datepicker/index.html
MIT License
1.52k stars 407 forks source link

[Feature request] Change month/year programmatically #675

Closed CavalcanteLeo closed 2 years ago

CavalcanteLeo commented 2 years ago

Using inline mode, I have to change next/prev month by clicking on a custom button.

Is that possible?

Also I had to hide the mx-calendar-header

::v-deep .mx-calendar-header {
  display: none;
} 

All of that because i have to create a custom header that looks like this (green circle):

Screen Shot 2022-01-05 at 01 13 07

and now i have to change the months with those pink arrows

Thanks

mengxiong10 commented 2 years ago

use CalendarPanel repalce DatePicker

<calendar-panel
  :value="value"
  @select="handleSelect"
  :calendar.sync="calendar"
></calendar-panel>
import DatePicker from 'vue2-datepicker';

const { CalendarPanel } = DatePicker;

export default {
  name: 'Basic',
  components: { CalendarPanel },
  data() {
    return {
      calendar: new Date(),
      value: new Date()
    };
  },
  methods: {
    handleSelect(val) {
      this.value = val;
    },
    handleNextMonth() {
      const nextMonth = new Date(this.calendar);
      nextMonth.setMonth(nextMonth.getMonth() + 1);
    },
  },
};
CavalcanteLeo commented 2 years ago

thanks