wxaSortPicker小程序首字母排序選擇器
發表時間:2021-3-31
發布人:葵宇科技
瀏覽次數:70
wxaSortPicker
版本號1.0.1
github地址: https://github.com/nickrogit/wxaSortPicker
說明:小程序首字母排序選擇器,網上有不少但覺得不太好,自己優化改進的這款覺得還不錯,后面再慢慢完善豐富。
版本說明
1.0.0版本僅支持字符串數組
1.0.1版本加入json數組支持,如:[{name:'中國',value:'China'},{name:'美國',value:'America'}],value取值e.target.dataset.value,其他不變
功能
字符串數組首字母排序
右側點擊字母定位
點擊item返回數據
開發要點
解析漢字Unicode編碼并排序
小程序scroll-view組件的scroll-into-view屬性,點擊右側字母改變scroll-into-view的屬性值,定位。
scroll-into-view(值應為某子元素id(id不能以數字開頭)。設置哪個方向可滾動,則在哪個方向滾動到該元素),
適用場景
城市、國籍、通訊錄等字母排序
功能預覽
使用方式
引入相關文件并初始化,詳情參看pages/index/index
var wxaSortPicker = require('../../utils/wxaSortPicker/wxaSortPicker.js');
onLoad: function () {
var that = this
//初始化
/*wxaSortPicker.init([
"澳大利亞", "阿富汗", "巴哈馬", "白俄羅斯", "比利時", "不丹", "巴西", "柬埔寨", "丹麥", "多米尼加","中國","蒙古","朝鮮","韓國","日本", "菲律賓","越南","老撾","緬甸","泰國","馬來西亞","文萊","新加坡","印度尼西亞","東帝汶","尼泊爾","不丹","孟加拉國","印度","巴基斯坦","斯里蘭卡","馬爾代夫","哈薩克斯坦","吉爾吉斯斯坦","塔吉克斯坦","烏茲別克斯坦","土庫曼斯坦","阿富汗","伊拉克","伊朗","敘利亞","約旦","黎巴嫩","以色列","巴勒斯坦","沙特阿拉伯","巴林","卡塔爾","科威特","阿拉伯聯合酋長國","阿曼","也門","格魯吉亞","亞美尼亞","阿塞拜疆","土耳其","塞浦路斯","芬蘭","瑞典","挪威","冰島","丹麥" ,"法羅群島","愛沙尼亞","拉脫維亞","立陶宛","白俄羅斯","俄羅斯","烏克蘭","摩爾多瓦","波蘭","捷克","斯洛伐克","匈牙利","德國","奧地利","瑞士","列支敦士登","英國","愛爾蘭","荷蘭","比利時","盧森堡","法國","摩納哥","羅馬尼亞","保加利亞","塞爾維亞","馬其頓","阿爾巴尼亞","希臘","斯洛文尼亞","克羅地亞","黑山","馬耳他","波斯尼亞和黑塞哥維那", "意大利", "梵蒂岡", "圣馬力諾", "西班牙", "葡萄牙", "安道爾", "直布羅陀", "哥斯達黎加", "巴拿馬","加拿大","美國","墨西哥","格陵蘭","圣皮埃爾和密克隆","危地馬拉","伯利茲","薩爾瓦多","洪都拉斯","尼加拉瓜","澳大利亞","新西蘭"
], that);*/
wxaSortPicker.init([
{ name: '中國', value: 'China'},
{ name: '俄羅斯', value: 'Russia' },
{ name: '美國', value: 'America' },
{ name: '澳大利亞', value: 'Australia' },
{ name: '巴西', value: 'Brazil' },
{ name: '韓國', value: 'Korea' },
{ name: '朝鮮', value: 'North Korea' },
{ name: '英國', value: 'Britain' },
{ name: '德國', value: 'Germany' },
{ name: '加拿大', value: 'Canada' },
{ name: '非洲', value: 'New Zealand' },
], that);
},
//選中返回值
wxaSortPickerItemTap: function(e){
console.log(e.target.dataset.text);
console.log(e.target.dataset.value);//字符串數組無此字段
}