Package Exports

@gravitano/vue-date-range-picker

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@gravitano/vue-date-range-picker) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Vue.js Date Range Picker

@gravitano/vue-date-range-picker is a Vue.js wrapper for daterangepicker plugin.

Installation

To install the new package, use one of those commands:

npm i @gravitano/vue-date-range-picker
# OR
yarn add @gravitano/vue-date-range-picker

Usage

Global usage.

// main.js
import Vue from "vue";
import App from "./App.vue";
import router from "./router";
// import the plugin
import DateRangePicker from "@gravitano/vue-date-range-picker";

Vue.config.productionTip = false;

// use the plugin
Vue.use(DateRangePicker);

new Vue({
  router,
  render: h => h(App)
}).$mount("#app");

After the plugin installed, you can use it like so:

<template>
  <div>
    <date-range-picker v-model="range" />
  </div>
</template>

<script>
export default {
  data: () => ({
    range: ["01/09/2018", "01/10/2018"]
  })
};
</script>

Per-component usage.

<template>
  <div>
    <date-range-picker v-model="range" />
  </div>
</template>

<script>
// import the package
import DateRangePicker from "@gravitano/vue-date-range-picker";

export default {
  components: {
    DateRangePicker
  },
  data: () => ({
    range: ["01/09/2018", "01/10/2018"]
  })
};
</script>

Props

Name	Type	Default	Description
v-model	Array	`[]`	Set v-model to the the content or data property you wish to bind it to
format	String	`DD/MM/YYYY`	Date format
className	String	-	Additional class name for the input
options	Object	`{}`	The daterangepicker's options. Learn more here.

Development Setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your tests

npm run test

Lints and fixes files

npm run lint

License

MIT