成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

vue-event-calendar 事件日歷插件

Kaede / 2344人閱讀

摘要：這里拿到的是傳入的單個(gè)所有數(shù)據(jù)組件事件可以監(jiān)聽(tīng)的事件有兩個(gè)，選擇了哪天和當(dāng)月是哪月，當(dāng)發(fā)生改變時(shí)，會(huì)觸發(fā)監(jiān)聽(tīng)函數(shù)。

vue-event-calendar 
vue-event-calendar是一款簡(jiǎn)單小巧的事件日歷組件，針對(duì)Vue2開(kāi)發(fā)。樣式美觀，且響應(yīng)式。
在線例子

依賴(lài)

vue: ^2.0.0

使用方法 安裝 
 npm install vue-event-calendar --save
入口 Main.js 
import "vue-event-calendar/dist/style.css" //1.1.10之后的版本，css被放在了多帶帶的文件中，方便替換
import vueEventCalendar from "vue-event-calendar"
Vue.use(vueEventCalendar, {locale: "en"}) //可以設(shè)置語(yǔ)言，支持中文和英文
用法示例
自定義事件模版（可以允許你展示更多信息）

vue-event-calendar允許自定義事件模版，但是這個(gè)功能需要Vue 2.1.0版本以上才可以使用。原因是我試用了2.1.0以上才有的新功能作用域插槽(Scoped Slots)。
組件事件

可以監(jiān)聽(tīng)的事件有兩個(gè)，選擇了哪天和當(dāng)月是哪月，當(dāng)發(fā)生改變時(shí)，會(huì)觸發(fā)監(jiān)聽(tīng)函數(shù)。函數(shù)中的回調(diào)參數(shù)為改變后的日期。

Options 
  // 當(dāng) Vue.use時(shí), 可以設(shè)置的參數(shù)
  {
    locale: "en",
    color: "black", //Set main color
    className: "Custom className for current clicked date", // (default: "selected-day")
    weekStartOn: "week Start on which day"  // Can be: 1, 2, 3, 4, 5, 6, 0 (default: 0)
  }
API 
// 下個(gè)月
this.$EventCalendar.nextMonth()
// 上個(gè)月
this.$EventCalendar.preMonth()
//到指定日期
this.$EventCalendar.toDate("2016/11/12")

可以看我寫(xiě)的Demo

開(kāi)發(fā)

可以在github直接clone我的項(xiàng)目然后執(zhí)行如下命令繼續(xù)二次開(kāi)發(fā)或發(fā)版，歡迎star&&issue

npm run dev  //develop
npm run build //production
Change log
1.3.6 -> 1.4.0

去除了當(dāng)天的背景，改用一個(gè)在日期下面的小圓點(diǎn)替代

增加選中日期樣式

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/86619.html

相關(guān)文章

  • 前端開(kāi)源項(xiàng)目周報(bào)0321

    摘要：由出品的前端開(kāi)源項(xiàng)目周報(bào)第十三期來(lái)啦。我們的前端開(kāi)源周報(bào)集合了一周來(lái)新收錄的優(yōu)質(zhì)的前端開(kāi)源項(xiàng)目，方便前端開(kāi)發(fā)人員便捷的找到自己需要的項(xiàng)目工具等。 由OpenDigg?出品的前端開(kāi)源項(xiàng)目周報(bào)第十三期來(lái)啦。我們的前端開(kāi)源周報(bào)集合了OpenDigg一周來(lái)新收錄的優(yōu)質(zhì)的前端開(kāi)源項(xiàng)目，方便前端開(kāi)發(fā)人員便捷的找到自己需要的項(xiàng)目工具等。react-perimeter 在元素周?chē)鷦?chuàng)建不可見(jiàn)paddin...

    Lemon_95 評(píng)論0 收藏0

  • 前端開(kāi)源項(xiàng)目周報(bào)0321

    摘要：由出品的前端開(kāi)源項(xiàng)目周報(bào)第十三期來(lái)啦。我們的前端開(kāi)源周報(bào)集合了一周來(lái)新收錄的優(yōu)質(zhì)的前端開(kāi)源項(xiàng)目，方便前端開(kāi)發(fā)人員便捷的找到自己需要的項(xiàng)目工具等。 由OpenDigg?出品的前端開(kāi)源項(xiàng)目周報(bào)第十三期來(lái)啦。我們的前端開(kāi)源周報(bào)集合了OpenDigg一周來(lái)新收錄的優(yōu)質(zhì)的前端開(kāi)源項(xiàng)目，方便前端開(kāi)發(fā)人員便捷的找到自己需要的項(xiàng)目工具等。react-perimeter 在元素周?chē)鷦?chuàng)建不可見(jiàn)paddin...

    OldPanda 評(píng)論0 收藏0

  • Cordova創(chuàng)建系統(tǒng)日歷事件

    摘要：在制作一款打卡的時(shí)候有這么一個(gè)需求創(chuàng)建提醒到系統(tǒng)日歷中，也就是利用系統(tǒng)日歷來(lái)做事件的提醒，這么做的好處很明顯，無(wú)需處理提醒的細(xì)節(jié)，也無(wú)需后臺(tái)。 在制作一款打卡App的時(shí)候有這么一個(gè)需求 -- 創(chuàng)建提醒到系統(tǒng)日歷中，也就是利用系統(tǒng)日歷來(lái)做事件的提醒，這么做的好處很明顯，App無(wú)需處理提醒的細(xì)節(jié)，也無(wú)需后臺(tái)。這個(gè)App是基于Cordova開(kāi)發(fā)的，并沒(méi)有訪問(wèn)系統(tǒng)日歷的接口，我們只能通過(guò)插件來(lái)...

    snowLu 評(píng)論0 收藏0

  • FullCalendar插件的基本使用

    摘要：插件的依賴(lài)文件插件的使用頁(yè)面結(jié)構(gòu)設(shè)置日歷頭部信息，如果設(shè)置為，則不顯示頭部信息。設(shè)置日歷的高度，包括日歷頭部，默認(rèn)未設(shè)置，高度根據(jù)值自適應(yīng)。 先說(shuō)一下我的另一博客地址: https://home.cnblogs.com/u/bllx/ FullCalendar的選擇 前段時(shí)間，一直在開(kāi)發(fā)考勤系統(tǒng)，當(dāng)時(shí)為滿足設(shè)計(jì)的需求，選了好幾個(gè)插件，最后決定采用Fullcanlendar的插件。感覺(jué)這...

    import. 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<