@mas.io/bu-classify v1.0.2

安装

tnpm install --save @alipay/bu-classify

组件介绍

行业小程序xxx组件，结合xxxx的组件样式，针对支付宝行业的各个不同场景进行定制化开发，满足业务需求。

参数说明

APP_INNER - 小程序内部页面 ALIPAY_APP - 支付宝页面 OUTER_APP - 外部小程序 H5 - 第三方h5页面

属性 | 必填 | 参数类型 | 参数说明 | 默认值 | 示例

appId ｜ 是 ｜ string ｜ 金刚位对应appId ｜ 2021002147639635

identifyPoint | 是 ｜ string | 点位标示(新建金刚位位点位标示) ｜ onlinemall_jinggang

extendParams | 否 ｜ string | 扩展参数 | ''

isSwiper ｜ 否 ｜ boolean | 是否使用滑块(swiper)方式(若不传，则当分类数量为10的整数倍时使用滑块，否则使用scroll-view)，传true/false则固定使用swiper/scroll-view方式 | null | true

onHandleTap | 否 ｜ function | 点击对应分类的回调事件,参数为对应分类项详情 | -- | (item) => {}

scrollBarClassName | 否 ｜ string | 滑动进度条类名(仅在scroll-view方式下生效，可自定义样式；注意：内部滑动条宽度固定为滚动条的50%，暂时请勿修改宽度，否则会导致滑动条滑动位置与实际滚动位置对应不上) | -- | ''

scrollBarLong | 否 ｜ number | 内部滚动条宽度占比(相对于总的进度条宽度),取值为 0 - 1 ｜ 0.5 ｜ 0.2

其他参数: swiper配置参数，仅在swiper形式下生效，下方为对应默认值，具体参数详情见：https://opendocs.alipay.com/mini/component/swiper indicatorDots: false, indicatorColor: 'rgba(0, 0, 0, .3)', indicatorActiveColor: '#000', autoplay: false, interval: 5000, circular: false, duration: 500,

在小程序中使用

{
  "usingComponents": {
    "mas-xxxx": "@alipay/bu-classify/es/index"
  }
}

在 page.axml 中引用组件

<!-- 页面使用方式 -->
  <!-- 非自控模式 -->
    <!-- 默认点击事件 -->
 <mas-xxxx
    appId="2088xxxxxx"
    identifyPoint="123"
    extendParams="{abc: 123}"
  />
    <!-- 部分自定义点击事件 -->
 <mas-xxxx
    appId="2088xxxxxx"
    identifyPoint="123"
    extendParams="{abc: 123}"
    onControlClick="customerJump"
    controlType="['APP_INNER', 'ALIPAY_APP']"
  />
  <!-- 自控模式 -->
 <mas-xxxx
    isControl="{{true}}"
    imgList="{{['http://www.baidu.com/a.png']}}"
    onControlClick="customerJump"
  />

Badges