更新记录

1.0.0(2023-12-06) 下载此版本

1、新增插件; 2、支持三级。


平台兼容性

uni-app

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
- × - - -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 快应用-华为 快应用-联盟
- × ×

其他

多语言 暗黑模式 宽屏模式
× ×

级联插件

希望能够帮到您

datas 数据源

titleKey 显示字段(默认title)(例如:一级分类)

childsKey 子集字段(默认childs)(下一级分组)

数据结构参考 代码片段,字段可根据自己的数据字段替换

复制代码<SxyMultiSelector class="multi-selector" :datas="datas" :titleKey="titleKey" :childsKey="childsKey" @click="selectAction"></SxyMultiSelector>

import SxyMultiSelector from '@/components/sxy-multi-selector/sxy-multi-selector.vue'
export default {
    data() {
        return {
            titleKey: 'title', // 要替换的key
            childsKey: 'childs', // 要替换的key
            datas: [{"title" : "一级分类" , "childs" : [{"title" : "二级分类" , "childs" : [{"title" : "三级分类" }]}]},
                {"title" : "一级分类" , "childs" : [{"title" : "二级分类" , "childs" : [{"title" : "三级分类" }]}]},
                {"title" : "一级分类" , "childs" : [{"title" : "二级分类" , "childs" : [{"title" : "三级分类" }]}]}]
        }
    },               
    components: {
        SxyMultiSelector
    },              
    methods: {
        selectAction(item) {
            console.log("===========选中了:",item)
        }
    }
}

If you found this package useful, please Star it . Any bug reports will be warmly received.

隐私、权限声明

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

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

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

许可协议

MIT协议
Assassin

2024-07-15

请问如何让第一和第二级拥有多个childkey呢

自由开发 2024-07-31

childkey 只是用于取下一级对象的键值,通过 childkey 取出的对象可以有很多参数,只是不会显示出来,UI 只会取 titlekey 用于页面展示,回调数据会带回所有的参数,如果你有特殊的字段需要展示在 UI 上,可以自行添加 childkey

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