更新记录

1.1.1(2024-01-05)

添加监听,优化网络请求返回数据不回显

1.1.0(2023-09-25)

修改数据回显的bug

1.0.9(2023-07-11)

感谢评论区小伙伴的纠正,粗心把indexPop写成indexsPop了,已修改,欢迎大家进入群聊一起摸鱼,也可以一起学习进步

查看更多

平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.5.0 app-vue app-nvue
钉钉小程序 快手小程序 飞书小程序 京东小程序
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

address-picker:基于uView的地区选择器组件

支持省市区三级联动,支持省,省市,省市区的选择,支持通过地区名、索引和地区id回显数据(优先级:地区名>索引>地区id),欢迎加入摸鱼交流群:469187546,一起来摸鱼啊🚀

直接下载插件导入hbuilder后可直接使用,下载示例项目解读会更加清晰

<template>
    <view class="content">
        <u-form>
            <u-form-item label="地址" prop="address" @click="addressShow = true;">
                <u--input v-model="address" disabled disabledColor="#ffffff" border="none"
                    placeholder='请输入家庭地址'></u--input>
            </u-form-item>
        </u-form>
        <address-picker :show="addressShow" closeOnClickOverlay @confirm='confirmAddress' @cancel='addressShow=false'
            @close='addressShow = false' :address-data="addressData" :indexs="indexs" :areaId="areaId" :type="type"></address-picker>
    </view>
</template>

通过传入type控制选择器,1:省,2:省市,3:省市区

<script>
    export default {
        data() {
            return {
                address: '',
                addressShow: false,
                indexs: [0, 0, 0],
                areaId: [1, 110000, 110101],
                addressData: ['北京市', '北京市', '东城区'],
                type: 3, //1-省,2-省市,3-省市区
            }
        },
        onLoad() {

        },
        methods: {
            confirmAddress(val) {
                console.log(val);
                this.address = val.value.join('')
                this.addressShow = false
            }
        }
    }
</script>

使用的uView的picker组件二次封装,所以props和方法都和picker组件一样,看不懂的可以去picker组件查看

https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/d2ce6dd2894c4539a4cb6a9ada0319d0~tplv-k3u1fbpfcp-watermark.image?

https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/acc5ac565eb342ccb2ed7eb54cdf0d21~tplv-k3u1fbpfcp-watermark.image?

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问