单选框和多选框

1，准备前段VS code

2.要先在后端使用redis存入购物车数据(保证有数据在前端显示)

后端展示数据
def get(self,request):
user_id=request.GET.get('user_id')
sss=Order.objects.filter(user_id=user_id).all()
user_obj = User.objects.filter(pk=user_id).first()
score=user_obj.score
sss_li=OrderSer(sss,many=True)
return Response({'code':200,'data':sss_li.data,'score':score})

在前端循环数据,渲染数据

购物车页面

积分:{{score}}

多选	id	商品姓名	商品价格	操作
	{{i.id}}	{{i.name}}	{{i.price}}	结算
全选			计算总数量:{{checks.length}}	计算总金额:{{total}}

data() {
return {
user_id:this.$route.query.user_id,
order_li:[],
total:0,
checks:[],
is_check:false,
score:0,
}
},

2.直接使用方法

先计算单选的数据和单选框

jjj:function(i_id,price,num){
if(this.checks.includes(i_id)){
this.checks.splice(this.checks.indexOf(i_id),1)
this.total-=pricenum-this.score
}else{
this.checks.push(i_id)
this.total+=pricenum-this.score
}
console.log(this.checks)
return this.total
},

然后使用全选框进行计算属性

lll:function(){
if(this.is_check){
this.total=0
this.checks=[]
}else{
this.total=0
this.checks=[]
this.order_li.forEach(i => {
this.checks.push(i.id)
});
this.sum_all()
}
},
sum_all(){
let sum=0
for(let i in this.order_li){
sum+=this.order_li[i].price*this.order_li[i].num
}
this.total=sum-this.score
return this.total
},