CODEWITHSUNDEEP
twitter-bootstraplaraveldatepickervue.jsvue-component
user2535909
user2535909

Reputation:

Vue 2.0 bootstrap 3 datepicker component

Where can I find a decent vue 2.0 bootstrap 3 datepicker component. I have tried almost everything out there. Most of the datepickers are vue 1.0 compatible.

I'm looking for something simple, to import in my child component, apply v-model on it and ready to go.

Upvotes: 0

Views: 2267

Answers (3)

wxsm
wxsm

Reputation: 586

Check my github project https://github.com/wxsms/uiv (Bootstrap 3 components implemented by Vue 2.)

Install:

npm install uiv --save

A simple code example:

<template>
  <date-picker v-model="date"/>
</template>
<script>
  import {DatePicker} from 'uiv'
  export default {
    components: {DatePicker},
    data () {
      return {
        date: null
      }
    }
  }
</script>
<!-- date-picker-example.vue -->

This will create an inline datepicker for you. for more usages (e.g. with form and dropdown) you can checkout the document page: https://uiv.wxsm.space/date-picker

Upvotes: 1

Ankur Kumar
Ankur Kumar

Reputation: 1

The link in previous comment is dead. Use this vue component instead.

npm install vue-flatpickr-component --save

It is dead simple to use.

<template>
  <div>
    <flat-pickr v-model="date"></flat-pickr>
  </div>
</template>

<script>
  import flatPickr from 'vue-flatpickr-component';
  import 'flatpickr/dist/flatpickr.css';

  export default {    
    data () {
      return {
        date: null,       
      }
    },
    components: {
      flatPickr
    }
  }
</script>

Upvotes: 0

AldoRomo88
AldoRomo88

Reputation: 2076

Give a try to vue-flatpickr. it isn't bootstrap datepicker but it's a really good alternative without jquery dependency.

Upvotes: 0

Related Questions