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

資訊專欄INFORMATION COLUMN

Calendar -『為移動端而生』的自定義日歷

Gu_Yan / 3319人閱讀

摘要：，歡迎使用中文文檔在后面自我介紹是為了滿足移動端對各種場景的需求而生的，兼容性強，靈活度高。如空數(shù)組默認(rèn)設(shè)置成當(dāng)月日數(shù)組的每一位分別是年月日。

Calendar - A Flexible Calendar for Mobile Intro

Calendar was born for several product requirements in the mobile. It’s free, cute and customized.

The Calendar was builded by protogenic JavaScript. So you can use it with jQuery，Vue, React, and so on.

github --- https://github.com/AppianZ/calendar, 歡迎使用


中文文檔在后面~

Calendar - 自我介紹

Calendar是為了滿足移動端對各種場景的需求而生的，兼容性強，靈活度高。

原生插件，可以與任何框架配合使用。

特色功能

?? 限制時間范圍，精確到【日期】

?? 有【直接布局】和【彈層顯示】兩種不同調(diào)用樣式

?? 自由設(shè)置【月份和星期的中英文顯示】、【星期天的排序位置】和【切換操作】

?? 利用回調(diào)控制【每一個日期】的不同樣式

?? 可以【選中】時間點，或【時間范圍】

?? 可以根據(jù)實際需要，【調(diào)整預(yù)判手勢的靈敏度】

親自體驗一下demo：??????

Demo & NPM

Calendar Demo

Calendar NPM

How To Use

1. html中：


    
    
我是一個點擊區(qū)域,大家快來點我

2. js中：

// 方式一, 直接引用

// 方式二, 引入npm包
import Calendar from "mob-calendar";

如何正確生成實例，請看參數(shù)列表：??????

參數(shù)列表
參數(shù)名稱 作用 類型 取值 是否必須
clickTarget 觸發(fā)彈層的dom元素ID {String} - ×
container 日歷容器的dom元素ID {String} - √
angle 調(diào)整預(yù)判手勢的靈敏度 {Number} 建議5-20 ×
isMask 布局是否使用彈層樣式 {Boolean} true:彈層顯示, false:正常布局 √
beginTime 開始時間點 {Array(Number)} 數(shù)組的每一位分別是年月日，空數(shù)組默認(rèn)1970年1月1日 √
endTime 結(jié)束時間點 {Array(Number)} 數(shù)組的每一位分別是年月日，空數(shù)組默認(rèn)次年12月31日 √
recentTime 當(dāng)前時間點 {Array(Number)} 數(shù)組的每一位分別是年月日，空數(shù)組默認(rèn)當(dāng)前月1日 √
isSundayFirst 星期天是否要放在第一列 {Boolean} true:星期日在第一列, false:星期日在最后一列 √
isShowNeighbor 是否展示相鄰月份的月尾和月頭 {Boolean} true:顯示相鄰月份的月尾和月頭, false:不顯示 √
isToggleBtn 是否展示左右切換按鈕 {Boolean} true:顯示左右切換按鈕， false:不顯示 √
isChinese 是否展示中文星期 {Boolean} true:顯示中文星期簡寫，false:顯示英文星期簡寫 √
monthType 月份的展示字符 {Number 0-3} 0:1月, 1:一月, 2:Jan, 3: January √
canViewDisabled 是否可以閱讀不在范圍內(nèi)的月份 {Boolean} true:無限滑動，false:只查看時間范圍內(nèi)的月份 √
beforeRenderArr 初次渲染時給特殊日期指定樣式 {無序Array(Object)} 數(shù)組元素有兩個參數(shù) 指定時間戳stamp{Number} 和 指定樣式名字className {String}，詳見下文 √
success 點擊某個日期的回調(diào) {Fuction(item, array,cal)} 返回3個自帶參數(shù)，item表示當(dāng)前點擊的時間戳，array表示連續(xù)兩次點擊的兩個時間戳,cal 指向?qū)嵗?/td> √
switchRender 日歷切換后的回調(diào) {Fuction(year, month, cal)} 返回3個自帶參數(shù)，year表示新生成的年份，month表示新生成的月份(從0開始), cal 指向?qū)嵗?/td> √

js中：

// 渲染時給特殊日期指定樣式的數(shù)據(jù)格式
beforeRenderArr: [{
    stamp: 1512057600000, // 指定某個時間戳
    className: "disable", //指定該時間戳渲染的樣式
}]

html中：

// 渲染后的效果如下
// li 是一個矩形，i 是圓形

  • 
    2
    • 原型鏈暴露的函數(shù) 作用 示例
    renderCallbackArr 渲染傳入的數(shù)組data，用于指定特定日期的特定樣式, 數(shù)組data和 beforeRenderArr 的數(shù)據(jù)格式一致 cal.renderCallbackArr(data)
    prevent 方便在回調(diào)中阻止默認(rèn)事件 cal.prevent()
    hideBackground 在彈窗模式中，可能需要用到的隱藏彈層的函數(shù) cal.hideBackground()
    Logs 2017.5.8(add) 
    正式發(fā)布第一版日歷
    Authors 
    如果你遇到了什么神bug，請發(fā)起ISSUE聯(lián)系我 ~
    

    我是嘉寶Appian，一個賣萌出家的算法妹紙。

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

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

    相關(guān)文章

    • Joda Time API介紹（1）基本介紹

      摘要：比的更好用，并且完美兼容的時間點此訪問用戶向?qū)У刂樊?dāng)前最新版本地址基本對象日期時間輸出結(jié)果本地日期時間輸出結(jié)果本地日期輸出結(jié)果本地時間輸出結(jié)果與相互轉(zhuǎn)換輸出結(jié)果與相互轉(zhuǎn)換 Joda Time : 比JDK的Date,Calendar更好用，并且完美兼容的時間API. 點此訪問Joda Time User Guide 用戶向?qū)У刂? joda-time joda-time ...

      BakerJ 評論0 收藏0

    • JAVA操作數(shù)據(jù)庫Datetime數(shù)據(jù)

      摘要：如何將類型插入數(shù)據(jù)庫中，成為好多人的一個不小的障礙。當(dāng)然，并不一定要在外部插入時間，因為在數(shù)據(jù)庫中，可以讓它自動插入，比如里面，用來插入當(dāng)前時間，而在時，便可以不用管它了。但有的時候還是避免不了，要手工插入時間，以更新數(shù)據(jù)庫。 在JDK 1.1后，java.util.Date 類型的大多數(shù)方法已經(jīng)不推薦使用了。代替它的是Calendar。 而在java.sql.Date 和 java...

      jonh_felix 評論0 收藏0

    • HashMap 分揀存儲 實現(xiàn)一對多映射

      摘要：實際需求中如何運用實現(xiàn)過濾重復(fù)這里的重復(fù)不一定是某個字段一樣的，而且時間點不重疊這里需要校驗不重疊的字段有員工所在部門，出發(fā)點，目的點，生效日期，失效日期，出發(fā)時點，到達(dá)時點，出發(fā)分鐘，到達(dá)分鐘是需要校驗的對象。 在我們的印象中，Map k，v 映射，一對一的比較多，下面主要講一對多的關(guān)系映射，主要需求在于，需要把很多的，雜亂的數(shù)據(jù) 按照不同的類型進(jìn)行分類處理，A,B,C類型的數(shù)據(jù)進(jìn)行...

      venmos 評論0 收藏0

    • 執(zhí)行定時器報空指針異常

      我遇到的問題是啟動定時器，然后在跟數(shù)據(jù)庫交互的地方報錯，Exception in thread Timer-1 java.lang.NullPointerException。后來檢查了一下是因為，dataAcquisitionVoMapper沒有正常注入，原始代碼如下： package com.hqgd.pms.controller.Timer; import java.text.SimpleD...

      zhichangterry 評論0 收藏0

    發(fā)表評論

    0條評論

    閱讀需要支付1元查看
    <