第一步:
# 在GoodsListViewset中添加一个RetrieveModelMixin继承类class GoodsListViewset(mixins.ListModelMixin, mixins.RetrieveModelMixin, viewsets.GenericViewSet):
urls.py中不用去动它
第二步建立商品图片的Serializer
# goods.py / serializers.py / GoodsImageSerializerclass GoodsImageSerializer(serializers.ModelSerializer):
class Meta:
model = GoodsImage
fields = ('image',)
第三步 将图片的Serializer嵌套到GoodsSerializer中
class GoodsSerializer(serializers.ModelSerializer):
# 嵌套序列化 外键
category = CategorySerializer()
# 这里 添加images字段关联过去many表示此字段会关联到多个图片字段数据(1对多)
images = GoodsImageSerializer(many = True)
class Meta:
model = Goods
fields = "__all__"
这样就可以了
数据显示:
文章图片
vue中需要把全局地址变量改成local_host
// src/api/api.js//商品详情
export const getGoodsDetail = goodId => {
return axios.get(`${local_host}/goods/${goodId}` + '/')
}
【Vue + Django 2.0.6 学习笔记 8.1 商品详情页的API接口】完结
推荐阅读
- Django|Python接口自动化测试系列[V1.0.0][加密接口]
- Django (一)-DRF(DjangoRESTframework)工程搭建
- Django中新版本变动和版本不同的各种坑 (持续更新)
- xadmin|ImportError: No module named 'reversion'
- 解决django1.11与Python3.7不兼容问题
- Django中的auto_now、auto_now_add
- python|web开发之Django(七)(注册、登录、会话以及跳转个人中心)
- django版本和python版本的对应
- django中如何修改网页title和站点header?
- 关于django2中views和url已经前端模板页面的关系