QDate lock to select only YYYY/MM

[MCK2]

Does anyone know if the q-calendar has any way to lock to select only year and month?

ex:
YYYY-MM
http://jsfiddle.net/eHLAw/3/?spm=a2c6h.14275010.0.0.78232770OqbDn0

[manacrox]

@MCK2 I was looking for the same, and came up with this solution:
The idea is to start with Year view then, when a month is selected, hide the popup calendar.

<template>
  <q-input
    readonly
    input-class="cursor-pointer"
    label="Select a Month"
    :value="monthPicked"
    @click="$refs.monthPicker.show()"
  >
    <template v-slot:append>
      <q-icon name="event" class="cursor-pointer">
        <q-popup-proxy ref="monthPicker" transition-show="scale" transition-hide="scale">
          <q-date
            minimal
            emit-immediately
            default-view="Years"
            v-model="monthPicked"
            @input="checkValue"
          />
        </q-popup-proxy>
      </q-icon>
    </template>
  </q-input>
</template>

<script>
export default {
  data () {
    return {
      monthPicked: null
    }
  },
  methods: {
    checkValue (val, reason, details) {
      if (reason === 'month') {
        this.$refs.monthPicker.hide()
      }
    }
  }
}
</script>

[dobbel]

@MCK2

You are talking about q-calendar in your post, but your topic title is about q-date.
Those are different components, q-date is a standard quasar component and q-calendar is a quasar extension.

Q-Calendar:
https://github.com/quasarframework/quasar-ui-qcalendar

Q-Date:
https://quasar.dev/vue-components/date