社区可能有其他的方案了，但是再分享下吧，给有需要的童鞋。
效果图：
额，这个视频转GIF因为社区上传不了大图，所以剪了一部分，具体的效果还是直接工具打开代码片段预览吧～
第一步：你的页面JSON引入该组件：
{
"usingComponents": {
"city-picker": "/components/cityPicker/index"
}
}
第二步：你的页面WXML引入该组件
<city-picker visible="{{visible}}" column="2" bind:close="handleClick" bind:confirm="handleConfirm" />
第三步：你的页面JS调用
// 显示/隐藏picker选择器
handleClick() {
this.setData(
visible: !this.data.visible
})
},
// 用户选择城市后 点击确定的返回值
handleConfirm(e) {
const {
detail: {
provinceName = '',
provinceId = '',
cityName,
cityId='',
areaName = '',
areaId = ''
} = {}
} = e
this.setData({
cityId,
cityName,
areaId,
areaName,
provinceId,
provinceName
})
}
组件属性
| 属性 | 默认值 | 描述 |
|---|---|---|
| visible | false | 是否显示picker选择器 |
| column | 3 | 显示几列，可选值：1，2，3 |
| values | [0, 0, 0] | 必填，默认回填的省市区下标，可选择具体省市区后查看AppData的regionValue字段 |
| close | function | 点击关闭picker弹窗 |
| confirm | function | 点击选择器的确定返回值 |
confirm:
| 属性 | 默认值 | 描述 |
|---|---|---|
| provinceName | 北京市 | 省份名称 |
| provinceId | 110000 | 省份ID |
| cityName | 市辖区 | 城市名称 |
| cityId | 110100 | 城市ID |
| areaName | 东城区 | 区域名称 |
| areaId | 110000 | 区域Id |
20200605 修复picker第一列滑动过快还未暂停就点击确定，输出异常的问题。
picker滚动到别的省份，然后点击取消，再显示的话会出错
为啥一打开链接就显示“请打开工具手动导入，若未安装可点击下载”呜呜哭了
麻烦大佬帮我看看 页面是空白
我把代码复制了 但是js中有报错
Cannot read property '0' of undefined
at Ui.onLoad (user.js? [sm]:20)
at Ui.<anonymous> (VM226 WAService.js:2)
at Ui.o.__callPageLifeTime__ (VM226 WAService.js:2)
at ir (VM226 WAService.js:2)
at VM226 WAService.js:2
at cr (VM226 WAService.js:2)
at a.<anonymous> (VM226 WAService.js:2)
at K.<anonymous> (VM226 WAService.js:2)
at K.emit (VM226 WAService.js:2)
at Object.emit (VM226 WAService.js:2)(env: Windows,mp,1.05.2107090; lib: 2.20.0)
雷霆嘎巴
大佬，想问一下这边设置是什么意思，我在项目中使用时候有时候会无法显示内容，wxml中没有未显示内容的标签，这大概是哪里的问题呢
大佬省市区的数据还有吗可以分享一下吗
大佬，我用你的原生文件复制了下，我更改了index也为组件，然后把index（里面有pop-up组件），拿到页面显示，
，页面显示不出选择的数据.