掘金者说-JavaScript简化笔记（三）

我们用手机进行点餐，作为商家端在管理商品列表中，要对商品数据进行置顶、上移、下移的操作。

前端

小程序前端代码脚本，如下：

置顶

// 临时如下处理，原本：const {gId, gTypeId = 0, gStatus = 2, gType, gSort} = e.currentTarget.dataset
const { gId, gTypeId = 15, gStatus = 2, gType = 21, gSort = 5 } = []; 
if (gSort == 1) {
  console.log("商品已处于置顶位置啦");
}

上移

// 临时如下处理，原本：const {gId, gTypeId = 0, gStatus = 2, gType, gSort} = e.currentTarget.dataset
const { gId, gTypeId = 15, gStatus = 2, gType = 21, gSort = 5 } = []; 
if (gSort == 1) {
  console.log("商品已在最上面啦");
}

下移

点击下移，将商品下移一个位置，如果已经处于分类最后的位置，则tips提示“商品已在最底下啦”

// 临时如下处理，原本：const {gId, gTypeId = 0, gStatus = 2, gType, gSort} = e.currentTarget.dataset
const { gId, gTypeId = 15, gStatus = 2, gType = 21, gSort = 5 } = []; 
// 1. 获取商品列表数据, 说明：typeId-分类ID，status-状态（0-已下架，2-已上架），type-类型（11-店内，21-外卖）
const goodsData = [
  { gId: 1001, gTitle: "苹果", gTypeId: 15, gStatus: 2, gType: 21, gSort: 4 },
  { gId: 1002, gTitle: "香蕉", gTypeId: 15, gStatus: 2, gType: 21, gSort: 3 },
  { gId: 1003, gTitle: "油奈", gTypeId: 15, gStatus: 2, gType: 21, gSort: 5 },
  { gId: 1004, gTitle: "白菜", gTypeId: 16, gStatus: 2, gType: 21, gSort: 1 },
  { gId: 1005, gTitle: "长豆", gTypeId: 16, gStatus: 2, gType: 21, gSort: 2 },
  { gId: 1006, gTitle: "花菜", gTypeId: 16, gStatus: 2, gType: 21, gSort: 4 },
];
console.log("1. 获取商品列表数据", goodsData);
// 2. 获取到指定类型的商品数据的序号
const goodsMap = goodsData.map((goods) => {
  if (goods.gTypeId == gTypeId && goods.gStatus == gStatus && goods.gType == gType) {
    return goods.gSort;
  } else {
    return 0;
  }
});
console.log("2. 获取指定商品数据的序号", goodsMap);
// 3. 获取最大值
const currentMaxSort = Math.max(...goodsMap);
console.log("3. 获取最大值", currentMaxSort);

if (gSort == currentMaxSort) {
  console.log("商品已在最底下啦");
}
// 4. 下移接口操作API