小程式 地區選擇器
最近花了兩週時間很急的上線了一個小程式,“CP對對碰“,上線後資料還可以,感覺小程式用來試錯效果很好。今天才算緩過來,所以整理一下這段時間寫的東西。
背景是用了官方API上的地區選擇器具之後點選不了,看報錯是地區的值沒有PUSH進去,而且不是全部機器都有問題。
官方文件在這裡
用法是這樣的
<view class="section__title">省市區選擇器</view>
<picker mode="region" bindchange="bindRegionChange" value="{{region}}" custom-item="{{customItem }}">
<view class="picker">
當前選擇:{{region[0]}},{{region[1]}},{{region[2]}}
</view>
</picker>
Page({
data: {
region: ['廣東省', '廣州市', '海珠區'],
customItem: '全部'
},
bindRegionChange: function (e) {
console.log('picker傳送選擇改變,攜帶值為', e.detail.value)
this.setData({
region: e.detail.value
})
}
...
})
因為我們只需要省份和城市,最後我是這樣解決的:
1,把地區選擇器改為多項選擇器
2,自己整理了省份-城市的資料:
var citys = {
'北京市': ['市轄區'],
'天津市': ['市轄區'],
'河北省': ['石家莊市', '唐山市', '秦皇島市', '邯鄲市', '邢臺市', '保定市', '張家口市', '承德市', '滄州市', '廊坊市', '衡水市', '省直轄縣級行政區劃'],
'山西省': ['太原市', '大同市', '陽泉市', '長治市', '晉城市', '朔州市', '晉中市', '運城市', '忻州市', '臨汾市', '呂梁市' ],
'內蒙古自治區': ['呼和浩特市', '包頭市', '烏海市', '赤峰市', '通遼市', '鄂爾多斯市', '呼倫貝爾市', '巴彥淖爾市', '烏蘭察布市', '興安盟', '錫林郭勒盟', '阿拉善盟'],
'遼寧省': ['瀋陽市', '大連市', '鞍山市', '撫順市', '本溪市', '丹東市', '錦州市', '營口市', '阜新市', '遼陽市', '盤錦市', '鐵嶺市', '朝陽市', '葫蘆島市'],
'吉林省': ['長春市', '吉林市', '四平市', '遼源市', '通化市', '白山市', '松原市', '白城市', '延邊朝鮮族自治州'],
'黑龍江省': ['哈爾濱市', '齊齊哈爾市', '雞西市', '鶴崗市', '雙鴨山市', '大慶市', '伊春市', '佳木斯市', '七臺河市', '牡丹江市', '黑河市', '綏化市', '大興安嶺地區'],
'上海市': ['市轄區'],
'江蘇省': ['南京市', '無錫市', '徐州市', '常州市', '蘇州市', '南通市', '連雲港市', '淮安市', '鹽城市', '揚州市', '鎮江市', '泰州市', '宿遷市'],
'浙江省': ['杭州市', '寧波市', '溫州市', '嘉興市', '湖州市', '紹興市', '金華市', '衢州市', '舟山市', '台州市', '麗水市'],
'安徽省': ['合肥市', '蕪湖市', '蚌埠市', '淮南市', '馬鞍山市', '淮北市', '銅陵市', '安慶市', '黃山市', '滁州市', '阜陽市', '宿州市', '六安市', '亳州市', '池州市', '宣城市'],
'福建省': ['福州市', '廈門市', '莆田市', '三明市', '泉州市', '漳州市', '南平市', '龍巖市', '寧德市'],
'江西省': ['南昌市', '景德鎮市', '萍鄉市', '九江市', '新餘市', '鷹潭市', '贛州市', '吉安市', '宜春市', '撫州市', '上饒市'],
'山東省': ['濟南市', '青島市', '淄博市', '棗莊市', '東營市', '煙臺市', '濰坊市', '濟寧市', '泰安市', '威海市', '日照市', '萊蕪市', '臨沂市', '德州市', '聊城市', '濱州市', '菏澤市'],
'河南省': ['鄭州市', '開封市', '洛陽市', '平頂山市', '安陽市', '鶴壁市', '新鄉市', '焦作市', '濮陽市', '許昌市', '漯河市', '三門峽市', '南陽市', '商丘市', '信陽市', '周口市', '駐馬店市', '省直轄縣級行政區劃'],
'湖北省': ['武漢市', '黃石市', '十堰市', '宜昌市', '襄陽市', '鄂州市', '荊門市', '孝感市', '荊州市', '黃岡市', '咸寧市', '隨州市', '恩施土家族苗族自治州', '省直轄縣級行政區劃'],
'湖南省': ['長沙市', '株洲市', '湘潭市', '衡陽市', '邵陽市', '岳陽市', '常德市', '張家界市', '益陽市', '郴州市', '永州市', '懷化市', '婁底市', '湘西土家族苗族自治州'],
'廣東省': ['廣州市', '韶關市', '深圳市', '珠海市', '汕頭市', '佛山市', '江門市', '湛江市', '茂名市', '肇慶市', '惠州市', '梅州市', '汕尾市', '河源市', '陽江市', '清遠市', '東莞市', '中山市', '潮州市', '揭陽市', '雲浮市'],
'廣西壯族自治區': ['南寧市', '柳州市', '桂林市', '梧州市', '北海市', '防城港市', '欽州市', '貴港市', '玉林市', '百色市', '賀州市', '河池市', '來賓市', '崇左市'],
'海南省': ['海口市', '三亞市', '三沙市', '儋州市', '省直轄縣級行政區劃'],
'重慶市': ['市轄區', '縣'],
'四川省': ['成都市', '自貢市', '攀枝花市', '瀘州市', '德陽市', '綿陽市', '廣元市', '遂寧市', '內江市', '樂山市', '南充市', '眉山市', '宜賓市', '廣安市', '達州市', '雅安市', '巴中市', '資陽市', '阿壩藏族羌族自治州', '甘孜藏族自治州', '涼山彝族自治州'],
'貴州省': ['貴陽市', '六盤水市', '遵義市', '安順市', '畢節市', '銅仁市', '黔西南布依族苗族自治州', '黔東南苗族侗族自治州', '黔南布依族苗族自治州'],
'雲南省': ['昆明市', '曲靖市', '玉溪市', '保山市', '昭通市', '麗江市', '普洱市', '臨滄市', '楚雄彝族自治州', '紅河哈尼族彝族自治州', '文山壯族苗族自治州', '西雙版納傣族自治州', '大理白族自治州', '德巨集傣族景頗族自治州', '怒江傈僳族自治州', '迪慶藏族自治州'],
'西藏自治區': ['拉薩市', '日喀則市', '昌都市', '林芝市', '山南市', '那曲地區', '阿里地區'],
'陝西省': ['西安市', '銅川市', '寶雞市', '咸陽市', '渭南市', '延安市', '漢中市', '榆林市', '安康市', '商洛市'],
'甘肅省': ['蘭州市', '嘉峪關市', '金昌市', '白銀市', '天水市', '武威市', '張掖市', '平涼市', '酒泉市', '慶陽市', '定西市', '隴南市', '臨夏回族自治州', '甘南藏族自治州'],
'青海省': ['西寧市', '海東市', '海北藏族自治州', '黃南藏族自治州', '海南藏族自治州', '果洛藏族自治州', '玉樹藏族自治州', '海西蒙古族藏族自治州'],
'寧夏回族自治區': ['銀川市', '石嘴山市', '吳忠市', '固原市', '中衛市'],
'新疆維吾爾自治區': ['烏魯木齊市', '克拉瑪依市', '吐魯番市', '哈密市', '昌吉回族自治州', '博爾塔拉蒙古自治州', '巴音郭楞蒙古自治州', '阿克蘇地區', '克孜勒蘇柯爾克孜自治州', '喀什地區', '和田地區', '伊犁哈薩克自治州', '塔城地區', '阿勒泰地區', '自治區直轄縣級行政區劃'],
'臺灣省': ['臺灣'],
'香港特別行政區': ['香港'],
'澳門特別行政區': ['澳門']
}
module.exports = citys;
相關推薦
小程式地區選擇器學習連結
學習連結:https://blog.csdn.net/yeshennet/article/details/79031012 <view class="section__title">省市區選擇器</view> <picker mode="region" bindchange=
小程式 地區選擇器 實現、呼叫
php五種設計模式 設計模式 一書將設計模式引入軟體社群,該書的作者是 Erich Gamma、Richard Helm、Ralph Johnson 和 John Vlissides Design(俗稱 “四人幫”)。所介紹的設計模式背後的核心概念非常簡單。經過多年的軟體開
小程式 地區選擇器
最近花了兩週時間很急的上線了一個小程式,“CP對對碰“,上線後資料還可以,感覺小程式用來試錯效果很好。今天才算緩過來,所以整理一下這段時間寫的東西。 背景是用了官方API上的地區選擇器具之後點選不了,看報錯是地區的值沒有PUSH進去,而且不是全部機器都有問題。
小程序地區選擇器學習鏈接
tail del 改變 選擇器 ons mode tro ron 鏈接 學習鏈接:https://blog.csdn.net/yeshennet/article/details/79031012 <view class="section__title">省市區選
小程式中選擇器picker使用
wxml: <view class="section_sex" > <image class='star-icon name-star-icon' src='../../image/star.jpg'></image> <view class="
微信小程式------聯動選擇器
picker 從底部彈起的滾動選擇器,現支援五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,預設是普通選擇器。 先來看看效果圖: 1:
微信小程式 城市選擇器 城市切換
程式碼很簡單. var city = require('../../utils/city.js'); var app = getApp() Page({ data: { searchLetter: [], showLetter: "",
小程式普通選擇器的rank-key的值必須帶單引號
picker是從底部彈起的滾動選擇器,現支援五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,預設是普通選擇器。今天在學習的時候 ,做普通選擇器的時候在
微信小程式 picker選擇器 從後臺拿值
這種東西在專案中是很常見的,文件上有的demo我這裡就不在重複一遍了,我現在說的是從後臺拿到的資料,放在這個選擇器裡。 後臺返回的格式是這樣的: 我們要實現的樣子是這樣的: 其實跟文件上介紹的普通選擇器差不多,只是多了幾個條件值, 我們一起來看一下程式碼:主要
小程式picker選擇器
picker選擇器分為三種,普通選擇器,時間選擇器, 日期選擇器 用mode屬性區分,預設是普通選擇器。測試時時間和日期點選無反應不知道是BUG還是啥!沒法手機測試現在也不知道咋回事!!主要屬性:普通選
小程式-節點選擇器
gettextHeight:function(){ var h=""; ////建立節點選擇器 var query = wx.createSelectorQuery(); // //選擇id query.select('#showtext').boundingClientRect() que
微信小程式 圖片選擇器
android開發中經常使用到頭像上傳需求,選擇圖片有二種方式,第一種是從相簿中選擇還有一種就是拍攝,小程式也有這個功能,而且比android容易多了, 先看官網給的文件: wx.chooseImage(Object object) 從本地相簿選擇圖片或使用相機拍照
微信小程式----picker選擇器(picker、省市區選擇器)(MUI選擇器)
效果圖 實現原理 利用微信小程式的picker元件,其中: 1,普通選擇器:mode = selector實現一級選擇例項; 2,省市區選擇器:mode = region實現省市區三級聯動; 3, 多列選擇器:mode
小程式如何進行地區選擇器 實現、呼叫?
region-widget.js var api = require('../../../utils/api/index.js');var constants = require('../../../utils/api/lib/constants');var raw = require(
微信小程序------聯動選擇器
程序 rdate let 簡單 格式 data image 選擇 logs picker 從底部彈起的滾動選擇器,現支持五種選擇器,通過mode來區分,分別是普通選擇器,多列選擇器,時間選擇器,日期選擇器,省市區選擇器,默認是普通選擇器。 先來看看效果圖: 1
微信小程式在編輯器上樣式正常,但在手機上不顯示樣式
之前做了個小工具,最近有時間,就加了頁面,在編輯器上的wxss樣式是正常的,但在手機上預覽就無法顯示 我目前只發現了一個顏色問題,但產生問題的真正原因沒去仔細研究,所以以後遇到其他的研究下再寫上來 解決方法: 原因:其他都生效,只是
ionic學習(十一):使用地區選擇器外掛
地址:https://github.com/raychenfj/ion-multi-picker 下面演示使用下面這個: 一:在app.module.ts中引入 二:我要在DevicePage中使用,首先在使用頁面的device.model.ts中引用,不然
小程式 字母選擇排序
wxml {{group.groupName}} {{user.name}} {{item}} js Page({ data:{ // 當前選擇的導航字母 selec
頭條小程式Component構造器
Component 構造器 Component 構造器可用於定義元件,呼叫 Component 構造器時可以指定元件的屬性、資料、方法等 定義引數 選項名 型別 是否必填 說明 properties Object 否 元件的對外屬性,是屬性名到屬性設定的對映表,
Scrapy 小技巧:選擇器(Selectors)怎麼寫
一、引言 最近剛好在學 Scrapy 框架。Scrapy 毋容置疑的強大。 但是有一點,就是它的選擇器語法實在是太難讓人上手了。畢竟在接觸 Scrapy 之前,我都是用 BeautifulSoup 進行選擇解析的,一下子讓我接觸 xpath 和 css 兩種