更新记录

1.1.4(2020-09-15) 下载此版本

修复了1.1.0(2020-09-14)微信小程序端,APP端运行异常的问题,均测试正常。如有问题请再反馈。

1.1.2(2020-09-15) 下载此版本

修复了微信小程序端,APP端运行异常的问题。如有问题请反馈。

1.1.0(2020-09-14) 下载此版本

多数使用者反馈,app端该组件(示例)运行异常。故而进行了app端与小程序端的测试并进行了调整,发现这两端均有运行异常情况。目前尚无有效解决办法。 在此也希望有能者相助,完善此插件。(有意向者请联系作者邮箱suojiantong@163.com) 不建议app端与小程序端的开发者下载及使用此插件,H5端可以正常使用。 因数据包内无台湾省、香港特别行政区、澳门特别行政区的市县信息,故而屏蔽了这三个地区的选项。请注意!!!

查看更多

平台兼容性

使用说明

该插件依赖于gb2260数据来源及地区编码参考

目前示例在H5端、微信小程序端、APP端测试均可用(测试环境H5端chrome 84.0.4147.105,小程序端1.03.2008270(调试基础库2.12.2),APP端网易mumu模拟器)

属性名 类型 默认值 说明
code String - 以地区编码的形式设置默认值(code和name只设置其中一个就可以)
name String - 以地区编码的形式设置默认值(code和name只设置其中一个就可以)
provincesRange String/Array - 设置省的可选范围,例['河南省'],则省选择项只有河南省
prefecturesRange String/Array - 设置市的可选范围,例['开封市','郑州市'],则市选择项只会有开封市和郑州市。如果选择的‘省’下,并无该城市,则此选项为空
countiesRange String/Array - 设置区的可选范围,例['禹王台区','金水区'],则区选择项只会有禹王台区和金水区,如果选择的‘市’下,并无该区域,则此选项为空
@update EventHandle 该组件初始化选项数据后发布的事件,name/code绑定属性的值发生改变时会触发该事件(响应默认值的动态变化)。可以接收到默认值数据event = {code: code, name: name}
@change EventHandle 该组件改变选项并确定或确定后发布的事件,可以接收到当前选项的数据event = {code: code, name: name}

基本示例

<template>
    <view class="container">
        <gb-picker
         @update="update"
         @change="change">
            <text>{{text}}</text>
         </gb-picker>
    </view>
</template>
export default {
    data() {
        return {
            text: '',
        }
    },
    methods: {
        update (e) {
            this.text = e.name.join('/')
        },
        change(e) {
            console.log(e.code)
            this.text = e.name.join('/')
        }
    }
}

限制省及市的选择范围

<template>
    <view class="container">
        <gb-picker
         :provincesRange='provincesRange'
         :prefecturesRange='prefecturesRange'
         @update="update"
         @change="change">
            <text>{{text}}</text>
         </gb-picker>
    </view>
</template>
export default {
    data() {
        return {
            provincesRange: ['河南省'],
            prefecturesRange: ['郑州市'],
            text: '',
        }
    },
    methods: {
        update (e) {
            this.text = e.name.join('/')
        },
        change(e) {
            console.log(e.code)
            this.text = e.name.join('/')
        }
    }
}

设置默认值(name)

<template>
    <view class="container">
        <gb-picker
         :name="name"
         @update="update"
         @change="change">
            <text>{{text}}</text>
         </gb-picker>
    </view>
</template>
export default {
    data() {
        return {
            text: '',
            name: ['河南省','郑州市','中原区']
        }
    },
    methods: {
        update (e) {
            this.text = e.name.join('/')
        },
        change(e) {
            console.log(e.code)
            this.text = e.name.join('/')
        }
    }
}

隐私、权限声明

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

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

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

许可协议

MIT协议

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