微信小程序项目_秋泊优选61

57、商品详情页面_收藏功能①

商品收藏（页面加载获取收藏数据）

1 页面onShow的时候―加载缓存中的商品收藏的数据
2 判断当前商品是不是被收藏

是改变页面的图标
不是 不做任何操作

3 点击商品收藏按钮

判断该商品是否存在于缓存数组中
已经存在把 该商品删除
没有存在 把商品添加到收藏数组中 存入到缓存中即可

pages\goos_detail\index.js

// 0 引入 来发送请求的方法 一定要把路径补全
import {request} from "../../request/index.js";
import regeneratorRuntime from '../../lib/runtime/runtime';
Page({

  /**
   * 页面的初始数据
   */
  data: {
    goodsObj:{},
    // 商品是否被收藏
    isCollect:false 
  }, 

  // 商品对象
  GoodsInfo:{},

  onShow: function () {

    let pages = getCurrentPages();
    let currentPage = pages[pages.length-1];
    let options = currentPage.options;

    const {goods_id}=options;
    // console.log(goods_id);
    // 调用
    this.getGoodsDetail(goods_id);
  },

  // 获取商品详情数据
  async getGoodsDetail(goods_id){
    const goodsObj=await request({url: "/goods/detail",data:{goods_id}});
    this.GoodsInfo=goodsObj;

    // 1 获取缓存中的商品收藏的数组
    let collect = wx.getStorageSync("collect") || [];

    // 2 判断当前商品是否被收藏
    let isCollect = collect.some(v => v.goods_id === this.GoodsInfo.goods_id);

    // console.log(res);
    this.setData({
      goodsObj:{
        goods_name:goodsObj.goods_name,
        goods_price:goodsObj.goods_price,
        // iphone部分手机不识别 webp图片格式
        // 最好找到后台让他进行修改
        // 临时自己改确保后台存在1.webp =>1.jpg (正则)
        goods_introduce:goodsObj.goods_introduce.replace(/\.webp/g,'.jpg'),
        pics:goodsObj.pics
      },
      isCollect
    })
  },
  ...