更新记录

1.0.4(2023-08-23) 下载此版本

文档优化

1.0.3(2023-08-23) 下载此版本

代码优化及文档优化

1.0.2(2023-08-23) 下载此版本

新增组件说明文档,新增设置组件默认选中

查看更多

平台兼容性

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

bf-address

基于 uniapppicker 二次封装的地区选择组件,支持h5、小程序、App。地区数据截止2023-06-04。

功能

  1. 支持省市区三级联动
  2. 支持数据回显
  3. 支持easycom

使用方式

安装完毕之后直接使用即可

<bf-address  :value="[0,0,1]" ref="bfAddress"  @confirm="onConfirm"></bf-address>
methods:{
    onConfirm(val) {        
        console.log(val)  // {label: '辽宁省-本溪市-平山区', code: '21,2105,210502'}
    }
}

属性及方法

参数 取值
value 用于设置地址回显,接收的是每列的下标,默认为[0,0,1],也就是北京省,北京市,东城区
@confirm 用于获取选中的省市区数据 {label: '辽宁省-本溪市-平山区', code: '21,2105,210502'}

内置方法codeToIndex

如需数据回显,可以传入省市区code码(必须是字符串),如:21,2105,210502,即可返回每列对应的下标

<bf-address  :value="value" ref="bfAddress"  @confirm="onConfirm"></bf-address>
<button @click="getIndex">
    模拟ajax获取code并给组件设置默认选中
</button>
data(){
    return {
        value:[0,0,1]
    }
}
methods:{
    getIndex(){
        setTimeout(()=>{
            var indexArr = this.$refs.bfAddress.codeToIndex("21,2105,210502")
            console.log(indexArr) // [5, 4, 0]
            this.value = indexArr  // 辽宁省-本溪市-平山区 自动选中
        },2000)

    }
}

隐私、权限声明

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

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

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

许可协议

MIT协议

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