66 lines
1.8 KiB
TypeScript
66 lines
1.8 KiB
TypeScript
// pages/index/index.ts
|
||
Page({
|
||
data: {
|
||
isManage: false,
|
||
startX: 0,
|
||
commodities: [
|
||
{
|
||
id: 1,
|
||
name: "水果鲜花是非得失发多少覅是范德萨司法的",
|
||
icon: "🍎",
|
||
active: false,
|
||
},
|
||
{ id: 2, name: "蔬菜豆制品", icon: "🥬", active: false },
|
||
{ id: 3, name: "肉禽蛋", icon: "🥩", active: false },
|
||
{ id: 4, name: "海鲜水产", icon: "🐟", active: false },
|
||
{ id: 5, name: "乳品烘焙", icon: "🥛", active: false },
|
||
{ id: 6, name: "熟食快", icon: "🍱", active: false },
|
||
],
|
||
},
|
||
|
||
onLoad() {},
|
||
// 点击管理按钮
|
||
onManage() {
|
||
this.setData({ isManage: !this.data.isManage });
|
||
this.setData({
|
||
commodities: this.data.commodities.map((item) => ({
|
||
...item,
|
||
active: this.data.isManage,
|
||
})),
|
||
});
|
||
},
|
||
// 触摸开始
|
||
handleTouchStart(e: any) {
|
||
this.setData({
|
||
startX: e.touches[0].clientX, // 记录起始X坐标
|
||
});
|
||
},
|
||
// 触摸移动
|
||
handleTouchMove(e: any) {
|
||
const { id, active } = e.currentTarget.dataset.item;
|
||
const moveX = e.touches[0].clientX - this.data.startX;
|
||
// 只响应向左滑动（moveX为负值）
|
||
if (moveX < -20) {
|
||
if (active) return;
|
||
const data = this.data.commodities.map((item) => {
|
||
item.active = item.id === id;
|
||
return item;
|
||
});
|
||
this.setData({ commodities: data });
|
||
} else {
|
||
this.setData({
|
||
commodities: this.data.commodities.map((item) => ({
|
||
...item,
|
||
active: false,
|
||
})),
|
||
});
|
||
}
|
||
},
|
||
// 删除商品
|
||
onDeleteItem(e: any) {
|
||
const { id } = e.currentTarget.dataset;
|
||
const data = this.data.commodities.filter((item) => item.id !== id);
|
||
this.setData({ commodities: data });
|
||
},
|
||
});
|