滑动操作 SwipeAction

滑动操作 SwipeAction

基本用法

**注意:因为仅支持触摸事件，所以请打开chrome手机模拟查看demo

<template lang="html">
<main>
     <div class="demo-hidden">
    <za-panel>
      <za-panel-header title="基本"></za-panel-header>
      <za-panel-body>
        <za-swipe-action
          autoClose
          @close='handleClose'
          @open='handleOpen'
          :right="action1">
          <za-cell>左滑看看（自动关闭）</za-cell>
        </za-swipe-action>
        <za-swipe-action
          @close='handleClose'
          @open='handleOpen'
          :left="action1">
          <za-cell>右滑看看</za-cell>
        </za-swipe-action>
        <za-swipe-action
          @close='handleClose'
          @open='handleOpen'
          :left="action1"
          :right="action1">
          <za-cell>左右都能滑动</za-cell>
        </za-swipe-action>
      </za-panel-body>
    </za-panel>
  </div>
</main>
</template>
<script>
export default {
  data() {
    return {
      action1:[
        {
          theme: 'error',
          text: '右按钮1',
          onClick: () => console.log('右按钮1'),
        },
        {
          theme: 'success',
          text: '右按钮2',
          onClick: () => console.log('右按钮2'),
        },
      ]
    }
  },
  methods: {
    handleClose(reason) {
      console.log(reason);
    },
    handleOpen(reason) {
      console.log(reason);
    },
  },
};
</script>

API

SwipeAction Attributes

SwipeAction Events