vue-bulma / datepicker

Datepicker Component for Vue Bulma
MIT License
115 stars 56 forks source link

How do I set minDate dynamically? #17

Closed xtianatilano closed 7 years ago

xtianatilano commented 7 years ago

I have two datepicker components, a start datepicker and end datepicker.

I tried passing the value of the start datepicker to end datepicker's minDate, it doesn't disable the dates prior to the selected date.

luventa commented 7 years ago

Hi @xtianproject . I think you do not need two datepicker for this. Try range example:

<template>
  <datepicker v-model="value" :config="{ wrap: true, mode: 'range' }" :inputClass="{ 'range-width': true }">
    <a class="button" data-toggle><i class="fa fa-calendar"></i></a>
    <a class="button" data-clear><i class="fa fa-close"></i></a>
  </datepicker>
</template>

<script>
import Datepicker from 'vue-bulma-datepicker'

export default {
  components: {
    Datepicker
  },

  data () {
    return {
      value: '2016-12-12 to 2016-12-13'
    }
  },
  watch: {
    value (newVal, oldVal) {
      console.log(newVal, oldVal)
    }
  }
}
</script>

<style lang="scss">
.range-width {
  width: 242px !important;
}
</style>
luventa commented 7 years ago

Also you can check this demo vue-admin/Datepicker