商品页展示---商品列表
发布时间
阅读量:
阅读量
Vue前端加载一类的商品数据 ,前端接口代码,以手机例:
//获取手机类的商品
this.getPromo("手机", "phoneList");//获取手机类的所有商品{},存入phoneList
// 获取商品数据
getPromo(categoryName, val, api) {
// 有API传入时,例子
// categoryName:["电视机", "空调", "洗衣机"],
// val:"applianceList",
// api:"/goods/getHotProduct/"
// 判断是否有api传进来
api = api != undefined ? api : "/goods/oneCategory/all/";
this.$axios
.post(api, {
categoryName
})
.then(res => {
console.log("@@获取"+categoryName+"的响应", res)
//获取属性,并赋值,如'phoneList'
this[val] = res.data;
})
.catch(err => {
return Promise.reject(err);
});
}
==Django后端接口实现代码==
#加载一类的所有商品
path("oneCategory/all/", GoodsList.as_view())
#视图接口
## 通过某个类别 --> 查所有商品
class GoodsList(APIView):
def post(self,request):
#类别名
cate_name = request.data.get('categoryName')
try:
# 查询类别对象
cate = Category.objects.get(cate_name=cate_name)
except Exception as e:
print(e)
return Response({'msg':'此商品类别不存在','code': 204})
goods_query_set = cate.goods_set.all()
goods_ser = GoodsSer(goods_query_set,many=True) #many=True,序列化多个对象集合
return Response(goods_ser.data)
热门商品
Vue加载热门商品(销量越多越热门) ==前端接口代码==,以家电为例:
// 获取家电类的商品,有API传入
this.getPromo(
["电视机", "空调", "洗衣机"],
"applianceList",
"/goods/getHotProduct/"
);
// 获取各类商品数据
getPromo(categoryName, val, api) {
// 有API传入时,例子
// categoryName:["电视机", "空调", "洗衣机"],
// val:"applianceList",
// api:"/goods/getHotProduct/"
// 判断是否有api传进来
api = api != undefined ? api : "/goods/oneCategory/all/";
this.$axios
.post(api, {
categoryName
})
.then(res => {
console.log("@@获取"+categoryName+"的响应", res)
//获取属性,并赋值,如'phoneList'
this[val] = res.data;
})
.catch(err => {
return Promise.reject(err);
});
}
==Django后端接口==
# 获取热门商品
path('getHotProduct/', HotGoods.as_view()),
#视图
from functools import reduce
## 获取热门商品
class HotGoods(APIView):
def post(self,request):
#获取前端数据
category_name = request.data.get("categoryName")
category_objs = [Category.objects.get(cate_name=i) for i in category_name]
temp_list = [cate.goods_set.all() for cate in category_objs]
#将三个类别的查询集 并 起来
r = reduce(lambda x,y:x|y, temp_list).order_by("-count") #销量越高,越热门
print("合并的查询集:",r)
goods_ser = GoodsSer(r,many=True)
return Response(goods_ser.data)
全部评论 (0)
还没有任何评论哟~
