更新记录

2.0(2019-11-12)

修改为通用组件,修复BUG

使用方法

    <view>
        <category :categoryList="categoryList" :subCategoryList="subCategoryList" @categoryMainClick="categoryMainClick" @categorySubClick="categorySubClick"></category>
    </view>
    <script>
        import category from "../../components/qiyue-category/qiyue-category.vue"
        export default {
            components:{
                category
            },
            data() {
                return {
                    categoryList:[],
                    subCategoryList:[]
                }
            },
            methods: {
                categoryMainClick(category){
                    this.subCategoryList = category.subCategoryList;
                },
                categorySubClick(category){
                    console.log(category);
                }
            },
            mounted() {
                for(var i=0;i<20;i++){
                    var subList = [];
                    for(var j=0;j<30;j++){
                        subList.push({"name":"分类"+i+":商品"+j,"logo":"http://placehold.it/50x50"})
                    }
                    this.categoryList.push({"name":"分类"+i,"subCategoryList":subList})
                }
                this.subCategoryList = this.categoryList[0].subCategoryList;
            }
        }
    </script>

参数说明

属性名 类型 默认值 说明
categoryList 数组 [] 主分类Array数据
subCategoryList 数组 [] 子分类Array数据
activeTextColor String #F24544 主分类激活时文字颜色
activeBackgroundColor String #e5e5e5 主分类激活时背景颜色
label String name 展示文字字段KEY
imgSrc 内容 logo 展示LOGO图片地址
categoryMainClick function 子分类点击事件
categorySubClick function 子分类点击事件

平台兼容性

-uni-app-left-navigation

uni-app 侧边导航分类 示例图;

隐私、权限声明

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

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

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

许可协议

MIT协议

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