vue移動端日曆元件 mintUi dateTime picker 設定開始和結束日期
=====================================追加提示2018.9.17===============================
繼續填坑 如果你想修改 這個元件的 取消和確定按鈕 則需要像下面的startDate一樣
在標籤上寫 :cancel-text 和 :confirm-text 然後用一個vue變數接一下 設定一下值就可以了
這裡我只想吐槽 屬性怎麼用 完全靠自己猜想 真的是可以了
=====================================追加提示2018.9.17===============================
=====================================追加提示2018.8.13===============================
這裡在設定初始時間的時候 又遇到一個bug 你的web頁面 在ios 和安卓開啟的時候 安卓還好 ios 存在問題!!!!!
這裡 樓主原來日期格式 都是 “2018-8-13”的格式 後來發現 如果你用這種格式設定初始時間 ios會有bug 顯示錯亂
然後 所有都要使用 “2018/8/13” 這種格式 這種格式在ios裡 不會報錯
=====================================追加提示2018.8.13===============================
==============================正文===========================
首先必須吐槽 mintui
<script src="https://cdn.bootcss.com/mint-ui/2.2.13/index.js"></script> <link href="https://cdn.bootcss.com/mint-ui/2.2.13/style.css" rel="stylesheet" type="text/css">
這個2.2.13版本中picker 聯動 你拉一會就對不上值了 也不知道這麼大的bug mintui自己看不見麼 然後搜了一圈
大家推薦2.2.9版本 說這個靠譜點
這裡假設 如果你有一個需求 比如 起始日期為某年的某月 而不是當前時間開始
那麼mintui的 picker 你可以放棄了
他的這個onValuesChange方法 那叫一個亂
這裡我友情提示這個方法返回2個引數 第一個引數是picker物件,第二個values裡是你聯動的選中值的陣列,(如下圖)
這裡還不難 不過如果你想懂官網的這句(下面的圖),你會發現官網一個例子都沒有,你都不知道咋用,
提示下,也就是這麼寫,
,
index是values這個陣列長度內的值 比如你2列拉動 那麼index 就是0,1
如果你3級聯動那就是0,1,2 剩下的你自己悟吧
=======================================華麗的分割線=========================================
上面純屬吐槽 ,這個元件太垃圾了。回到我們的要求 如果你想設定拉動的初始值,比如日期的
你需要使用DateTime Picker 這個元件又是一個大坑
(這裡我真是服了,包括官網,你們給的api 自己不試麼 給別人的例子也不試???????)
來看官網
這是樓主用的,由於業務要求只顯示年和月,所以要去掉日,這裡嘗試刪除date-formate 或給他的value設定null和空字串
均失敗!!!!!!!!!!!!!!!!!!!!!!!
就問你服不服這元件,然後樓主沒辦法只能靠js+css了,沒辦反,如果你有更好的,可以告訴我
好了,日不顯示了,然後就是最大的坑了,設定起止時間
來看官網
然後樓主就寫成這個樣子,問題來了。 他!不!好!使!!!!!!
然後百度,官網+所有百度到的都是這麼寫
https://www.cnblogs.com/smallteeth/p/8004462.html 連結1
https://blog.csdn.net/mhlghy/article/details/80269774 連結2
https://blog.csdn.net/thekingyu/article/details/78974852 連結3
我不再掛連結了 反正都是一個樣 也沒一個好使,我也是服了。最後,還是英語救了樓主
這是js控制檯報的弱警告,然後樓主讀了一遍 大概明白了 所以做了替換 結果 好!使!了!
哎,這年代,誰都靠不住,只能靠自己,希望這部落格能幫助到使用這個元件的人。我把頁面原始碼掛出來,需要的去下載吧
https://download.csdn.net/download/gaoqiang1112/10571933 連結