地區picker 各選擇器，優劣分析

番茄西紅柿發布于2019-04-23 13:09 / 1964人閱讀

摘要：移動端選擇器有很多，各大組件都有自己的，比如，，，等等。這次的地區選擇，需要地區的省份市經緯度，還要設置第一次點開的時候是特定城市。引入樣式和文件地區選擇級聯地區選擇設定默認選項省份城市代碼很簡單，不懂的百度一下。

移動端選擇器picker有很多，各大ui組件都有自己的picker，比如light7，HUI，MUI，jqueryUI等等。但是，我發現他們都有各種各樣的問題。這次的地區選擇，需要地區的省份+市+經緯度，還要設置第一次點開的時候是特定城市。

demo：鏈接：https://pan.baidu.com/s/1n5ApFB4elywxD_QekhSW6Q 密碼：cd2k

分析一波問題：

先說light7，它的picker是最low的，data里只有選項，木有ID，更木有其他內容。雙聯三聯picker的時候想特定一個選項就更別說了，在彈窗里用的時候更是惡心，曾經改過它的源代碼，想讓它更實用一點，但只能用在普通選擇，這次的需求直接把它pass掉了。

HUI：它的picker比light7好一點點，data里面可以放value和text。但是在雙聯的時候并不能設置特定城市，而且在快速滾動的時候，迅速點確定，會出現結果是北京而內容卻定格在天津的情況。

MUI：emmmm，這是一個最不要臉的框架：“最接近原生APP的前端框架”，以前拿它做過幾個P2P的APP，是挺簡單的，但是有很多奇怪的問題，比如和jquery各種沖突什么的，這里就不多說了。它的picker，只能設置單聯的特定城市，在快速滾動點確定的時候比HUI還要不堪，會出現廣西壯族自治區——南京......而且治不好。。。

最后選擇了mobile Picker：這個東西暫時沒發現類似上面那些框架的毛病，起碼在這次的需求是完全滿足的。




    
        
        mobileSelect Demo
        
        
        
        
        
        

        
        
        
        

    

    

        
            地區選擇-級聯

代碼很簡單，不懂的百度一下。

最后發表一下感言，以前喜歡用框架，項目做多了才發現沒有一款框架是可以完美滿足一切需求的，現在我做移動端項目已經不再用框架了，因為框架需要加載CSS和JS，就算再好的框架也是會占用帶寬和用戶瀏覽器性能的，不如提取出各框架中有用的屬性或者模塊，視項目而選擇屬性加載。

云服務器 GPU云服務器各大云服務器的優劣地區選擇地區選擇api 青云主機地區選擇

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/1502.html

Ionic2+angular4地區選擇組件

摘要：最近在項目重構的過程中，發現之前用寫的地區選擇指令在中很難重用畢竟是用。但是此組件并不符合我的要求。我不是單純的選擇省市區，還可能是選擇省市或者省。最近在項目重構的過程中，發現之前用mobiscroll寫的地區選擇指令在angular2中很難重用（畢竟是用typeScript）。于是就萌生了自己寫一個組件的想法。想和之前一樣基于mobiscroll去寫，但是發現非常耗費精力，于是某日...

FleyX 2019-08-20 18:20 評論0 收藏0
演示微信小程序地區選擇偽五級聯動

　　在項目中，要求微信小程序的地區可以選擇偽五級聯動　　展示如下　　這里采用的是自定義多列選擇器picker mode="multiSelector"　　<viewclass="section"> 　　<viewclass="section__title">多列選擇器</view> 　　<pick...

3403771864 2022-11-08 23:27 評論0 收藏0
微信小程序日期選擇器使用實例

　　需求：在小程序開發中，時常會遇到日期選擇器、時間選擇器或者地區選擇器來進行選擇的功能。這是可以形成模板，只是在其中有細微變化，比如：樣式會多樣化、功能會復雜化。現在我們寫一個合適的組件。　　下面跟大家分享下我寫的一個自定義日期選擇器組件　　首先上效果圖看看:　　主要步驟：　　第一步：首先自定義選擇器組件需要用到picker-view跟picker-view-column。使用方法如下~　　&l...

3403771864 2022-11-19 22:18 評論0 收藏0
微信小程序picker組件遇到的問題與解決方案

摘要：幾個主要屬性選取范圍，數據類型為，為普通選擇器時，有效的值表示選擇了中的第幾個下標從開始，數據類型肯定是綁定事件，改變時觸發事件，。代碼如下選項一選項二選項三一二三四五這樣，一個頁面使用多個的問題就解決了。但在發現小一個問題。一、picker基本概念當然先看官方文檔 picker說明搞清楚基本概念從底部彈起的滾動選擇器，現支持三種選擇器，通過mode來區分，分別是普通選擇器，時間選...

tulayang 2019-08-20 17:18 評論0 收藏0