一款輕量級(jí)vue2.x日歷組件
vue2-date-component 一款基于vue2.x日期時(shí)間選擇組件
項(xiàng)目地址：https://github.com/lhd1324/vue2-date-component
該組件支持常用的日期時(shí)間格式配置费坊，同時(shí)也包括日期標(biāo)記茅逮。
1>支持的時(shí)間格式預(yù)覽圖：
格式1：yyyy/mm/dd hh:mm:ss
1.gif
格式2：yyyy-mm-dd hh:mm:ss
2.gif
格式3：yyyy-mm-dd
3.gif
格式4：hh:mm:ss
4.gif
格式5：yyyy-mm-dd hh
5.gif
格式6：yyyy-mm-dd hh:mm
6.gif
格式7：hh:mm
7.gif
2>查看原插件(how to start)
安裝依賴(lài)
npm insatll
運(yùn)行服務(wù)
npm run dev
查看項(xiàng)目文件中demo 引入時(shí)間組件的例子
//引入代碼
<Datepicker ref="Datepicker" :options.asyn="options"></Datepicker>
import Datepicker from '../vueDatepicker/index';
export default {
data() {
options:{
curtime:"2018/06/10 10:02:03", //為空時(shí)，獲取當(dāng)前時(shí)間 （參數(shù)是必須項(xiàng)培己，但可以不賦值）
format:"yyyy/mm/dd hh:mm:ss", //時(shí)間格式 （必選項(xiàng)）
isHideOtherday:false, //是否禁止選擇未標(biāo)記的日期（true禁止) （可選項(xiàng)）
markList:[ //需要標(biāo)記的日期和自定義的標(biāo)記樣式只能為某日標(biāo)記，不能添加時(shí)分秒 （可選項(xiàng)）
{
date: '2018-06-02', //日期
className: "label1" //自定義class選擇器名稱(chēng)
}, {
date: '2018/4/2',
className: "label1"
}, {
date: '2018/06/13',
className: "label2"
}
]
},
},
watch:{ //監(jiān)聽(tīng)日期變化后執(zhí)行的操作
'options.curtime':function(){
console.log(this.options.curtime)
}
}
}
3>npm包安裝
安裝插件包
npm install vue2-date-component
引入插件
import myDatepicker from 'vue2-date-component'
*注意這里引入的有兩種插件接口類(lèi)型（使用時(shí)選其一）
接口1
import Vue from 'vue'
Vue.use(myDatepicker.Datepicker)
接口2
components: {
Datepicker:myDatepicker.VueDatepicker
}
希望能對(duì)大家的項(xiàng)目有所幫助实苞，歡迎吐槽剪廉！
項(xiàng)目地址：https://github.com/lhd1324/vue2-date-component 感謝大家star
