1、先看效果
2、直接上代码 ui结构
<view class="bind" @longpress="deleteImage" :data-index="index">
<view class="bind_left">绑定设备</view>
<view class="bind_right">
<view class="bind_top">
<text class="bind_title">F039</text>
<text>一拖四充电桩</text>
</view>
<view class="bind_body">
<text class="bind_title">SN00000000000125 | 1F01</text>
<image class="icon_imaeg1" src="../../static/saoma/back.png" mode="aspectFit"></image>
</view>
<view class="bind_bottom">
<view class="bottom_title1">1</view>
<view class="bottom_title1">2</view>
<view class="bottom_title1">3</view>
</view>
</view>
</view>
3、js 逻辑
// 长按删除
const deleteImage = (e) => {
console.log('长按', e);
const index = e.currentTarget.dataset.index; //获取当前长按图片下标
uni.showModal({
title: '提示',
content: '确定删除吗?',
success: function (res) {
if (res.confirm) {
uni.showToast({
title: '删除成功',
icon: 'none'
});
} else if (res.cancel) {
uni.showToast({
title: '取消删除',
icon: 'none'
});
console.log('用户点击取消');
}
}
});
};