uniapp——对加入购物车进行权限管理

​持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第27天，点击查看活动详情

将商品添加到购物车要先监听购物车点击

对购物车添加权限需要用到下面这种接口

 ​

把接口进行二次封装

detail.js

export function AddCart(id,type,num){
	return myRequest({
		url:`/cart`,
		method:'POST',
		data:{
			shop_id:id,
			skus_type:type,
			num:num
		},
		header:{
			token:true
		}
	})
}

引入detail.js

	import {
		getDetail,AddCart
	} from '../../utils/detail.js'

对添加购物车按钮设置点击事件addCart

			addCart() {
				//  this.detail请求的页面数据
				// this.detail.id请求到的id值
				// this.detail.goodsSkus[this.checkgoodsSkusIndex].id
				// 判断他是否为单规格，如果是单规格那么就将单规格中的id值传给sku_type,如果为多规格那么就将多规格中的id值传给sku_tpye
				let shop_id = this.detail.sku_type === 0 ? this.detail.id : this.detail.goodsSkus[this.checkgoodsSkusIndex]
					.id
				// 这个skus_type就是请求数据中的单规格与多规格
				let skus_type = this.detail.sku_type
				// num商品数量
				let num = this.detail.num
				console.log(shop_id);
				AddCart(shop_id,skus_type,num).then(res=>{
					console.log(res);
					uni.$emit('updateCart')
					uni.showToast({
						title: '添加成功！正在进入购物车页面.....',
						icon:'none'
					});
					uni.switchTab({
						url:'../cart/cart'
					})
				})
			},

​编辑

 ​编辑

 ​编辑

在request.js中进行判断拦截 

			if (options.header.token == false) {
				uni.showToast({
					title: '请先登录',
					icon: 'none'
				});
				return setTimeout(() => {
					uni.navigateTo({
						url: '/pages/login/login',
					});
				}, 1000)
			}

​

 ​

对用户登陆进行权限管理

​

​

总结：当我们点击添加购物车的时候，在方法中addCart方法先获取商品信息，再通过Vuex里的commit，调用的就是mutations里面的addCart，将商品拿到，然后判断之前有没有该商品，如果有的话，直接在之前的基础上加1，没有的话，设置其数量为1。

​