安装

npm i vue2-datepick --save

初始化(main.js)

import Calendar from 'vue2-datepick';
Vue.use(Calendar);

使用方法

<template>
  <div id="integral">
      <p @click = "setDate" >点击设置日期(默认今天)</p>
      <p>选中的时间{{date}}</p>
      <p @click = "setDate2" >设定指定的日期(2010-3-2)</p>
      <p>选中的时间{{date2}}</p>

  </div>
</template>
<script>
export default {
  name: 'integral',
  data(){
      return{
          date:'',
        date2:'2010-3-2'
        }
  },
  methods:{
    setDate(){
      this.$picker.show({
        type:'datePicker',
        onOk: (date) =>{
          this.date = date
        }
      });
    },
    setDate2(){
      this.$picker.show({
        type:'datePicker',
        date:this.date2,  //初始化时间
        onOk:(e)=>{
          this.date2 = e;
        },
      })
    },
  },
}
</script>

效果展示

这个使用时点击按住滑动的哦

 

posted on 2018-04-28 15:32  妞妞不安  阅读(231)  评论(0编辑  收藏  举报