diff --git a/src/pages/goods_detail/goods_detail.vue b/src/pages/goods_detail/goods_detail.vue index 02bf3be..ffd5688 100644 --- a/src/pages/goods_detail/goods_detail.vue +++ b/src/pages/goods_detail/goods_detail.vue @@ -14,7 +14,7 @@ - + {{goods_name}} @@ -40,7 +40,7 @@ 购物车 - 加入购物车 + 加入购物车 立即购买 @@ -56,14 +56,19 @@ export default { goods_name: "商品名称", goods_price: "0", goods_introduce: "", + isCollect: false } }, onLoad( {goods_id} ){ console.log(goods_id) this.goods_id = goods_id this.getGoodsDetail() + // 页面加载的时候,查找本地存储当前商品是否已经被收藏了 + const collectList = uni.getStorageSync("collectList") || []; + this.isCollect = collectList.some((item) => item.goods_id === goods_id) }, methods: { + // 获取商品信息 async getGoodsDetail(){ const { pics, goods_name, goods_price, goods_introduce } = (await this.$u.api.getGoodsDetail({ goods_id: this.goods_id })).message this.pics = pics @@ -81,10 +86,46 @@ export default { this.goods_introduce = htmlStr } }, + + // 大图预览 showBigImgHandle(current){ const urls = this.pics.map(item => item.pics_big) uni.previewImage({ urls, current }) //Array. 数组内是字符串格式 + }, + + // 收藏. 本地存储 + collectHandle(){ + const goodsObj = { + goods_id: this.goods_id, + goods_small_logo: this.goods_small_logo, + goods_price: this.goods_price, + goods_name: this.goods_name, + } + // 从本地读取 + const collectList = uni.getStorageSync("collectList") || []; + const index = collectList.findIndex( + (item) => item.goods_id === this.goods_id + ) + if(index === -1) { + // 未存在便添加 + collectList.push(goodsObj) + }else{ + // 已存在便删除 + // splice() 方法用于添加或删除数组中的元素 + // 第一个参数表示从哪开始, 第二个参数表示删除几个 + // 会改变原数组 + collectList.splice(index, 1) + } + // 更新本地存储 + uni.setStorageSync("collectList", collectList) + // 状态翻转 + this.isCollect = !this.isCollect + }, + + // 添加到购物车 + addToCartHandle(){ + console.log('加入购物车') } }, @@ -106,6 +147,9 @@ export default { } .info { padding: 20rpx 30rpx; + .icon-shoucang { + color: #fcaa23; + } .info_head { display: flex; .price {