更新记录

1.0.1（2025-06-30） 下载此版本

修改源数据类型bug

调整组件样式

1.0.0（2025-06-30） 下载此版本

1、区划选择，支持树形静态数据、层级动态数据

2、支持树形子项字段、区划名字段、区划编号字段重定义

3、回传常用数据，方便小伙伴使用

平台兼容性

uni-app

uni-app x

其他

sjx-area-select

该组件为uni_modules组件，下载导入后可以全局直接使用，无需在页面中引入、声明组件

Props

Events

内置点击tabs重新选择区划

代码演示

页面代码

<template>
    <view style="padding: 20px;">
        <button type="primary" @click="selectArea">动态选择区域</button>
        <sjx-area-select style="min-height: 100px;" v-if="isShow" :areaArr="firstArea" @areaClick='getArea'
            areaName="name" areaNumber="code" :isTree="false" :requestData="requestData"></sjx-area-select>
        <button type="primary" @click="selectAreaTree" style="margin-top: 10px;">静态选择区域</button>
        <sjx-area-select v-if="isShowStatic" :areaArr="areaArr" @areaClick='getAreaTree' areaName="name"
            areaNumber="code" childsName="children"></sjx-area-select>
    </view>
</template>

动态选择区域

selectArea() {
    this.isShow = true
},
/* item--当前项；areaName--当前区划名；areaNameArr--全区全名称数组；areaNumber--当前区划代码；isLeaf--是否是最后一级 */
getArea(item, areaName, areaNameArr, areaNumber, isLeaf) {
    console.log('区划全名称', areaNameArr.join('#'));
    /* 模拟接口请求 */
    setTimeout(() => {
        if (this.count % 5 == 4) {
            this.count = 0
            this.requestData = []
            this.isShow = false
        } else {
            this.requestData = [{
                name: `区划1-${this.count}`,
                code: 'num'
            }, {
                name: `区划2-${this.count}`,
                code: 'num'
            }, {
                name: `区划3-${this.count}`,
                code: 'num'
            }]
            this.count++
        }

    }, 1000)
}

静态选择区域

selectAreaTree() {
    this.isShowStatic = true
},
/* item--当前项；areaName--当前区划名；areaNameArr--全区全名称数组；areaNumber--当前区划代码；isLeaf--是否是最后一级 */
getAreaTree(item, areaName, areaNameArr, areaNumber, isLeaf) {
    console.log('区划全名称', areaNameArr.join('#'));
    this.isShowStatic = !isLeaf
}

关于我

1、如有不足或不方便的地方，请指出，我尽快完善。

2、各位小伙伴如果需要其他插件的话，请留言，我会根据实际需求及自身能力完成插件或给出建议。

谢谢大家！