主要使用swiper插件，这里使用各小技巧，就是用两个swiper容器，点击一个小图容器，去让大图容器展示出来 小图容器 遮罩层 大图容器 小图切换js 点击小图展示大图并且切换js 部分样式 ...

方法一是自己想出来的，方法二来自忘记哪里看到的了 不知道是不是你要的效果： 方法一：利用input[type="radio"] css代码： html： vue实例： 方法二：利用数组（把每一行当做数组第几个位置eg ...

第一种 v-bind:class="{ active: item.isActive } v-on:click="doSomething"active是样式名,内容是红色背景.item.isActive在data中，为布尔值。doSomething在methods中，对item.isActive ...

创建一个商品详情页面展示的工程。是一个表现层工程。 达成效果： 在搜索结果页面点击商品图片或者商品标题，展示商品详情页面。 前端展示代码： url请求: 参数： 使用redis做缓存 业务逻辑： 1、根据商品id到缓存中查找 2、查到缓存，直接返回 ...

...

打造生鲜超市（一）：项目介绍，环境搭建打造生鲜超市（二）：model设计打造生鲜超市（三）：xadmin后台管理 打造生鲜超市（四）：商品列表页打造生鲜超市（五）：商品类别数据显示 一、商品列表页 1、 goods/serializers.py 序列化 2、goods ...

当点击商品图片的时候，会跳转到商品的详情页面，我们看下具体是如何实现的： 1、点击商品的图片，打开商品详情页面 a) 商品基本信息 b) 延迟加载商品详情。延迟一秒加载使用ajax c) 商品的规格参数。按需加载，当用户点击商品规格参数tab页 ...

一、商品详情页功能 1、viewsets实现商品详情页接口 　　商品详情页，需要加上mixins.RetrieveModelMixin，因为路由为/goods/id/，因此在之前商品列表页视图中继承详情页类。代码逻辑为： 这样商品的详情页就完成 ...