vue時間插件

1. 安裝

npm i vue-calendar-component --save

2. template部分

<Calendar
  v-on:choseDay="clickDay"
  v-on:changeMonth="changeDate"
  // v-on:isToday="clickToday"
  // :markDate=arr // arr=['2018/4/1','2018/4/3'] 標記4月1日和4月3日 簡單標記
  // :markDateMore=arr // 多種不一樣的標記
  // 第一個標記和第二個標記不能同時使用
  // :agoDayHide='1514937600' //某個日期之前的不容許點擊  時間戳10位
  // :futureDayHide='1525104000' //某個日期之後的不容許點擊  時間戳10位
  // :sundayStart="true" //默認是週一開始 當是true的時候 是週日開始
></Calendar>

3.JavaScript部分

import Calendar from 'vue-calendar-component';
export default {
    components: {
        Calendar
    },
   methods: {
          clickDay(data) {
          console.log(data); //選中某天
        },
        changeDate(data) {
          console.log(data); //左右點擊切換月份
        },
        clickToday(data) {
          console.log(data); // 跳到了本月
        }
    }
}

API

屬性	說明	默認	是否必傳
choseDay	選中某天調用的方法，返回選中的日期 YY-MM-DD	無	否
changeMonth	切換月份調用的方法，返回切換到某月的日期 YY-MM-DD	無	否
isToday	切換月份的時候，若是切到當前月份，調用這個方法，返回當前月今天	無	否
markDate	若是須要某月的幾天被標註，傳當月的日期數組。如["2018/2/2","2018/2/6"]被會標註（相同的標記）	空數組	否
markDateMore	須要不一樣的標記如上Usage 最後一行示例代碼	空數組	否
agoDayHide	某個日期之前的不容許點擊 時間戳長度是 10 位	0	0
futureDayHide	某個日期之後的不容許點擊 時間戳長度是 10 位	很大	否
sundayStart	默認是週一開始 當是true的時候 是週日開	false	否
textTop	日曆頭部的文字，默認是 [ '日','一', '二', '三', '四', '五', '六'] ，能夠根據本身的需求進行不一樣的修改。	---	否

碼字不易，點個讚唄💗，支持支持

相關推薦：
jquery操做樣式 jq修改添加css樣式和class樣式類
java面試題最容易犯錯的8道題
java能夠對map的key排序嗎
java中常見的幾種鎖有哪些
關於Java的三種隨機數生成方式介紹
仿京東驗證碼效果代碼

閱讀原文