unique-interface/examples/faas-ui/_component/swipe/swipe.html

无UI组件库

<!--  TODO 目前该组件是pc、移动2端共用，后续可能会拆开  -->
<div class="swipe" @mouseenter="clearTimer" @mouseleave="initTimer">
    <v-touch style="height:100%"
        @panstart="panStart"
        @panend="panEnd"
        @press="pressFunction"
        @pressup="pressUpFunction">
        <div class="swipe-items-wrap" ref="container">
            <img v-for="(item, index) in imgList"
                :src="item.url"
                @load="loadImg"
                :key="index"
                style="width:100%;height: 100%;display:block;"
                @click="triggerClick(item)">
        </div>
    </v-touch>
    <template v-if="imgList.length > 1">
        <div class="swipe-button-container">
            <span class="swipe-pre-button swipe-button" @click.stop="animateAction('prev')">
                <span class="uicon uicon-left"></span>
            </span>
            <span class="swipe-next-button swipe-button" @click.stop="animateAction('next')">
                <span class="uicon uicon-right"></span>
            </span>
        </div>
        <div class="swipe-indicators">
            <div
                class="swipe-indicator"
                v-for="(page, $index) in pages"
                :class="{ 'is-active': $index == index }">
            </div>
        </div>
    </template>
</div>