vue-thuong-datepicker v1.0.5

vue-thuong-datepicker

A Datepicker Component For Vue2

Demo

https://thuong-datepicker-example.web.app/

Install

$ npm i vue-thuong-datepicker --save

Usage

Import in main.js

import Vue from "vue";
import VueThuongDatepicker from "vue-thuong-datepicker";

Vue.use(VueThuongDatepicker);
...

Usage

<template>
  <VueThuongDatepicker
    v-model="datetime"
    placeholder="hehehe"
    refs="inputDate"
    mode="range"
    @onFocus="onFocus"
    @onBlur="onBlur"
    @onSelect="onSelect"
    @onClear="onClear"
  />
</template>

<script>
  export default {
    data() {
      return {
        datetime: null,
      };
    },
    methods: {
      onFocus() {
        console.log("focus");
      },
      onBlur() {
        console.log("blur");
      },
      onSelect(val) {
        console.log(val);
      },
      onClear() {
        console.log("clear");
      },
    },
  };
</script>

Props

Example of v-model

If range is 'single', v-model can be a string or null.
Case multiple, v-model can be an Array of date's string [] or null.
Case range, v-model can be an Object like { from_date: '20/04/2022', to_date: '21/04/2022' } or null.

Events

Copyright (c) 2022 by ThuongND