功能需求
产品提出来需要实现左滑动特定的一项,来显示删除按钮,用户右滑动隐藏删除按钮(ps:没用原生的是因为样式与视觉给的不符合,不如自己设计一个)
具体功能实现
1. html部分
<template>
<view class="content">
<view class="container" @touchstart="touchS" @touchmove="touchM" @touchend="touchE" :style="{left: leftStyle + 'rpx'}">
<view>
lalalallalal
</view>
<view class="delete-icon">
删除
</view>
</view>
</view>
</template>
核心功能逻辑:修改leftStyle的值使container进行滑动
2. js部分
export default {
data() {
return {
leftStyle: 0,
startX: 0,
hiddenFlag: true,
delBtnWidth: 220