wxaSortPicker

版本號(hào)1.0.1 
github地址: https://github.com/nickrogit/wxaSortPicker 
說(shuō)明：小程序首字母排序選擇器，網(wǎng)上有不少但覺(jué)得不太好，自己優(yōu)化改進(jìn)的這款覺(jué)得還不錯(cuò)，后面再慢慢完善豐富。

版本說(shuō)明

1.0.0版本僅支持字符串?dāng)?shù)組 
1.0.1版本加入json數(shù)組支持，如：[{name:'中國(guó)',value:'China'},{name:'美國(guó)',value:'America'}]，value取值e.target.dataset.value，其他不變

功能

字符串?dāng)?shù)組首字母排序 
右側(cè)點(diǎn)擊字母定位 
點(diǎn)擊item返回?cái)?shù)據(jù)

開(kāi)發(fā)要點(diǎn)

解析漢字Unicode編碼并排序 
小程序scroll-view組件的scroll-into-view屬性，點(diǎn)擊右側(cè)字母改變scroll-into-view的屬性值，定位。 
scroll-into-view（值應(yīng)為某子元素id（id不能以數(shù)字開(kāi)頭）。設(shè)置哪個(gè)方向可滾動(dòng)，則在哪個(gè)方向滾動(dòng)到該元素），

適用場(chǎng)景

城市、國(guó)籍、通訊錄等字母排序

功能預(yù)覽

使用方式

引入相關(guān)文件并初始化，詳情參看pages/index/index

1. var wxaSortPicker = require('../../utils/wxaSortPicker/wxaSortPicker.js');
2. onLoad: function () {
3. var that = this
4. //初始化
5. /*wxaSortPicker.init([
6. "澳大利亞", "阿富汗", "巴哈馬", "白俄羅斯", "比利時(shí)", "不丹", "巴西", "***", "丹麥", "多米尼加","中國(guó)","蒙古","朝鮮","韓國(guó)","日本", "***","越南","**","**","泰國(guó)","馬來(lái)西亞","文萊","新加坡","印度尼西亞","東帝汶","尼泊爾","不丹","孟加拉國(guó)","印度","巴基斯坦","斯里蘭卡","馬爾代夫","哈薩克斯坦","吉爾吉斯斯坦","塔吉克斯坦","烏茲別克斯坦","土庫(kù)曼斯坦","阿富汗","伊拉克","伊朗","敘利亞","約旦","黎巴嫩","以色列","巴勒斯坦","沙特阿拉伯","巴林","卡塔爾","科威特","阿拉伯聯(lián)合酋長(zhǎng)國(guó)","阿曼","也門(mén)","格魯吉亞","亞美尼亞","阿塞拜疆","土耳其","塞浦路斯","芬蘭","瑞典","挪威","冰島","丹麥" ,"法羅群島","愛(ài)沙尼亞","拉脫維亞","立陶宛","白俄羅斯","俄羅斯","烏克蘭","摩爾多瓦","波蘭","捷克","斯洛伐克","匈牙利","德國(guó)","奧地利","**","列支敦士登","英國(guó)","愛(ài)爾蘭","荷蘭","比利時(shí)","盧森堡","法國(guó)","摩納哥","羅馬尼亞","保加利亞","塞爾維亞","馬其頓","阿爾巴尼亞","希臘","斯洛文尼亞","克羅地亞","黑山","馬耳他","波斯尼亞和黑塞哥維那", "意大利", "梵蒂岡", "圣馬力諾", "西班牙", "葡萄牙", "安道爾", "直布羅陀", "哥斯達(dá)黎加", "巴拿馬","加拿大","美國(guó)","墨西哥","格陵蘭","圣皮埃爾和密克隆","危地馬拉","伯利茲","薩爾瓦多","洪都拉斯","尼加拉瓜","澳大利亞","新西蘭"
7. ], that);*/
8.  
9. wxaSortPicker.init([
10. { name: '中國(guó)', value: 'China'},
11. { name: '俄羅斯', value: 'Russia' },
12. { name: '美國(guó)', value: 'America' },
13. { name: '澳大利亞', value: 'Australia' },
14. { name: '巴西', value: 'Brazil' },
15. { name: '韓國(guó)', value: 'Korea' },
16. { name: '朝鮮', value: 'North Korea' },
17. { name: '英國(guó)', value: 'Britain' },
18. { name: '德國(guó)', value: 'Germany' },
19. { name: '加拿大', value: 'Canada' },
20. { name: '非洲', value: 'New Zealand' },
21. ], that);
22. },
23.  
24. //選中返回值
25. wxaSortPickerItemTap: function(e){
26. console.log(e.target.dataset.text);
27. console.log(e.target.dataset.value);//字符串?dāng)?shù)組無(wú)此字段
28. }