vue-calendar-range-mobile
v1.0.0
Published
vue calendar mobile
Downloads
11
Maintainers
Readme
vue-calendar-range-mobile
用于移动端的选择日期范围
vue >= 2.0
快速开始
安装
npm install vue-calendar-range-mobile
引入
import Vue from 'vue'
import Calendar from 'vue-calendar-range-mobile'
import 'vue-calendar-range-mobile/dist/calendar.css'
Vue.use(Calendar)
或者组件中引入单个组建
import {Calendar} from 'vue-calendar-range-mobile'
或者页面中引用
<!-- 引入样式 -->
<link rel="stylesheet" href="package/dist/calendar.css">
<!-- 引入组件库 -->
<script src="package/dist/calendar.js"></script>
使用
<template>
<div class="test">
<button @click="open">test</button>
<div>{{start}}</div>
<div>{{end}}</div>
<Calendar ref="calendar" :done="selectDate" :default-value="defaultValue"></Calendar>
</div>
</template>
<script>
export default {
data(){
return {
start: '',
end: '',
defaultValue: [Date.now(), Date.now()+86400000]
}
},
mounted: function() {
},
methods: {
open(){
this.$refs.calendar.open();
},
selectDate(selectData){
this.start = selectData.startDate;
this.end = selectData.endDate;
}
},
components: {
}
}
</script>