移動端浏覽器對于select的展示樣式是不一緻的,ios下是類似原生的picker,安卓下各浏覽器展示各異,我們需要一個選擇器元件來統一各端下各種浏覽器的展示。
iosselect是個什麼東西?
移動端浏覽器對于select的展示樣式是不一緻的,ios下是類似原生的picker,安卓下各浏覽器展示各異,我們需要一個選擇器元件來統一各端下各種浏覽器的展示。下面是它的一個截圖:
iosselect 項目位址:
文檔和demo可以通路github:https://github.com/zhoushengmufc/iosselect
iosselect能做什麼?
移動端開發中,經常遇到選擇器功能,常見的時間選擇,日期選擇,地區選擇,單列選擇。iosselect完美實作一個元件實作各種選擇器的功能。
先看demo:
一級級聯,銀行選擇
http://zhoushengfe.com/iosselect/demo/one/bank.html
二級級聯,三國殺将領組合選
http://zhoushengfe.com/iosselect/demo/two/sanguokill.html
三級級聯,省市區選擇
http://zhoushengfe.com/iosselect/demo/three/area.html
viewport縮放時處理方案
http://zhoushengfe.com/iosselect/demo/rem/bank.html
日期選擇器 三級關聯,通過方法擷取資料,并且有加載中效果
http://zhoushengfe.com/iosselect/demo/datepicker/date.html
日期時間選擇器,共五級,通過方法擷取資料
http://zhoushengfe.com/iosselect/demo/five/time.html
iosselect的優勢
iosselect接口豐富,适用于多類場景
可以定制依賴關系,規定各層級之間是否有關聯。
可以定制選擇層級,支援1-5層選擇。
可以定制各項高度,可以規定展示項數,預設展示7項。
移動端rem應用普遍,無論你是px還是rem,使用iosselect都完全不是問題。
可以提供靜态資料,也可以使用方法擷取資料,支援同步方法和異步方法。
iosselect基于iscroll5開發,除此外無任何依賴,是以無論你是react還是angular還是vue還是zepto jquey都不是問題。