微信小程序 WeUI·Slideview

Slideview

左滑刪除組件，基礎(chǔ)庫(kù) 2.4.4 開始支持。

示例代碼：

{
  "usingComponents": {
    "mp-cells": "../components/cells/cells",
    "mp-cell": "../components/cell/cell",
    "mp-slideview": "../components/slideview/slideview"
  }
}

<view class="page">
    <view class="page__hd">
        <view class="page__title">Slideview</view>
        <view class="page__desc">左滑操作</view>
    </view>
    <view class="page__bd">
      <view class="weui-cells">
          <mp-slideview buttons="{{slideButtons}}" bindbuttontap="slideButtonTap">
              <mp-cell value="左滑可以刪除" footer="說明文字"></mp-cell>
          </mp-slideview>
      </view>

      <view class="weui-slidecells">
        <mp-slideview buttons="{{slideButtons}}" icon="{{true}}" bindbuttontap="slideButtonTap">
          <view class="weui-slidecell">
            左滑可以刪除（圖標(biāo)Button）
          </view>
        </mp-slideview>
      </view>
    </view>
</view>

var base64 = require("../images/base64");
Page({
    onLoad: function(){
        this.setData({
            icon: base64.icon20,
            slideButtons: [{
              text: '普通',
              src: '/page/weui/cell/icon_love.svg', // icon的路徑
            },{
              text: '普通',
              extClass: 'test',
              src: '/page/weui/cell/icon_star.svg', // icon的路徑
            },{
              type: 'warn',
              text: '警示',
              extClass: 'test',
                src: '/page/weui/cell/icon_del.svg', // icon的路徑
            }],
        });
    },
    slideButtonTap(e) {
        console.log('slide button tap', e.detail)
    }
});

屬性列表

buttons提供按鈕組配置，每一項(xiàng)表示一個(gè)按鈕，每一項(xiàng)的屬性為