WeChat gadget WeUI Slideview

May 21, 2021 WeChat Mini Program Development Document

Slideview

Slide left to remove components, and base library 2.4.4 starts to support.

Example code:

{
  "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">
            左滑可以删除（图标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)
    }
});

WeChat gadget WeUI Slideview

The list of properties

Property	Type	The default	Required	Description
ext-class	string		Whether	A class added to the internal structure of a component that can be used to modify the style inside a component
disable	boolean	false	Whether	Whether to disable slideview
buttons	array<object>	[]	Is	A left-slip set of buttons, up to 3 buttons are recommended
icon	boolean	false	Whether	Whether the button is icon
show	boolean		Whether	Whether the display is displayed, you can control the hidden display
duration	boolean	350	Whether	Slideview shows the length of the hidden animation
throttle	number	40	Whether	When the finger moves beyond this value, the display of the trigger view is triggered to hide
bindbuttontap	eventhandler		Whether	The event triggered when the buttons button group clicks, the detail is the data, the data, which is the data parameter passed in by the button's configuration item
bindhide	eventhandler		Whether	The event that was triggered when it was hidden
bindshow	eventhandler		Whether	The event that was triggered when it was displayed

Buttons provide a button group configuration, each representing a button, and each item has a property

Property	Type	The default	Required	Description
extClass	string		Whether	The additional class of the button, which can be used to modify the style inside the component
type	string	default	Whether	The type of button, valued default and warn, warn is the red button
text	string		Whether	The text of the button
Src	string		Whether	If icon is true, this property is valid
data	any		Whether	Trigger bindbuttontap's backped up data

WeChat gadget WeUI Slideview

Table of contents

Slideview

Example code:

The list of properties

Cookie Consent