更新记录

1.0.2(2021-08-17) 下载此版本

增减商品数量时,提供 step 步长

1.0.1(2021-08-17) 下载此版本

清空购物车

1.0.0(2021-08-17) 下载此版本

  1. 修复切换时的定位问题
  2. 新增完整示例
查看更多

平台兼容性

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

商品分类列表

一个简单的商品分类列表

使用

    <mo-product-list :list="list">
        <template v-slot:header="{item}">
            <view class="title">{{item.name}}</view>
        </template>
        <template v-slot="{item}">
            <view>{{item.name}}</view>
        </template>
    </mo-product-list>
    import testJson from './test.json'
    export default {
        data() {
            return {
                list: testJson
            }
        }
    }

属性/事件

属性/事件 说明 类型 默认值
list 商品列表 Array []
animation 是否开启滚动动画 Boolean false
title-fixed 是否显示右边分类目录 Boolean true
open-tag 是否开启左侧目录红点角标 Boolean false
tag-key 角标入参字段 String tag
icon-key 左侧目录图标入参字段 String icon
icon-size 左侧目录图标大小 Number 18
icon-color 左侧目录图标颜色 String #666
lower-threshold 距底部多远时(单位px),触发 scrollEnd 事件 Number 50
bottom 预留底部占位(单位px),底部需要按钮时避免遮挡 Number 0
@scroll 滚动事件 Function (e)=>{}
@scrollEnd 滚动到底部触发事件 Function (e)=>{}

插槽

属性/事件 说明
default 默认插槽
header 头部插槽

示例说明

文件中包含两个示例:
一个简单的demo和一个应用示例,应用示例使用了uni-popup,项目中需要自行引入uni_modules/uni-popup组件。

隐私、权限声明

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

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

插件不采集任何数据

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

许可协议

MIT协议

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