Vue + Django 2.0.6 学习笔记 8.1 商品详情页的API接口

待我称王封你为后i 2022-01-14 11:45 178阅读 0赞

第一步：

# 在GoodsListViewset中添加一个RetrieveModelMixin继承类
    
    class GoodsListViewset(mixins.ListModelMixin, mixins.RetrieveModelMixin, viewsets.GenericViewSet):

urls.py中不用去动它

第二步  建立商品图片的Serializer

# goods.py / serializers.py / GoodsImageSerializer
    
    class 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__"

这样就可以了

数据显示：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NvdWx3eWI_size_16_color_FFFFFF_t_70][]

vue中需要把全局地址变量改成local\_host

// src/api/api.js
    
    
    //商品详情
    export const getGoodsDetail = goodId => {
      return axios.get(`${local_host}/goods/${goodId}` + '/')
    }

完结

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NvdWx3eWI_size_16_color_FFFFFF_t_70]: /images/20220114/3c99398150e44befb523203fd7c8b563.png

发表评论取消回复

表情：

评论列表（有 0 条评论，178人围观）

还没有评论，来说两句吧...

相关阅读

相关拼多多海量商品数据接口API 商品详情接口商品价格主图接口

拼多多，作为中国最大的社交电商之一，提供了丰富的商品信息和海量的用户数据。对于广大开发者而言，如何快速、准确地获取这些数据，进而开发出各种创新应用，是他们关心的问题。本文将详细

梦里梦外;/ 2024年03月26日 22:24/ 0 赞/ 24 阅读

相关淘宝商品销量数据接口API 淘宝商品价格接口API 淘宝商品详情数据接口API

API是什么？ API（Application Programming Interface，应用程序编程接口）是一组定义、规范了不同软件组件之间交互的方法。简单来说，AP

左手的ㄟ右手/ 2024年03月24日 20:45/ 0 赞/ 85 阅读

相关 Python爬虫学习笔记：1688商品详情API 开发API接口文档

![8958464c58234fb95a4d4b7322a94c51.jpeg][] 1688API接口是阿里巴巴集团推出的一种开放平台，提供了丰富的数据接口、转换工具以及开

快来打我*/ 2024年03月17日 20:54/ 0 赞/ 90 阅读

相关京东商品价格详情API接口分享

item\_get-获得JD商品详情公共参数 <table> <thead> <tr> <th>名称</th> <th>类型</th>

快来打我*/ 2024年02月23日 03:37/ 0 赞/ 99 阅读

相关虾皮商品采集商品详情API接口

API具体是啥？ API是应用程序编程接口（Application Programming Interface）的缩写。它是一组定义了软件组件之间交互的规范和方法的集合。AP

不念不忘少年蓝@/ 2024年02月21日 11:04/ 0 赞/ 60 阅读

相关京东商品详情页数据采集API接口商品价格详情图获取API测试成功全过程

京东目前有的API列表如下： item\_get 获得JD商品详情 item\_search 按关键字搜索商品 item\_search\_img 按图搜索

迈不过友情╰/ 2024年02月05日 15:12/ 0 赞/ 68 阅读

相关快手商品采集API商品列表API商品详情数据API接口获取快手商品信息API

![702e7d227641417781b38327077c3b34.png][] 背景介绍快手商城是快手平台上的一个电商购物频道，类似于淘宝、京东等商城，用户可以通

淩亂°似流年/ 2024年02月05日 14:00/ 0 赞/ 77 阅读

相关实现商品详情页

实现了一个常用到的商品详情页，效果如下：关键代码如下： 1 pragma mark - 配置各个滚动视图的上拉和下拉操作 2 - (void)co

ゝ一纸荒年。/ 2023年03月13日 02:28/ 0 赞/ 24 阅读

相关商品详情页商品放大镜效果

源码下载地址：https://gitee.com/meijunna/lunbo html <!DOCTYPE html PUBLIC "-//W3C//DTD XH

骑猪看日落/ 2022年05月20日 02:50/ 0 赞/ 401 阅读

相关 Vue + Django 2.0.6 学习笔记 8.1 商品详情页的API接口

第一步：在GoodsListViewset中添加一个RetrieveModelMixin继承类 class GoodsListViewset(m

待我称王封你为后i/ 2022年01月14日 11:45/ 0 赞/ 179 阅读