uniapp商城之商品分类

ops/2025/1/31 6:57:38/

文章目录

  • 前言
  • 一、新建分类组件
    • 1.轮播图效果
  • 二、一级分类与Tab交互
    • 1.封装API接口
    • 2.初始化调用
    • 3.定义类型
    • 4.渲染一级分类
    • 5.Tab交互
  • 三、二级分类与商品渲染
    • 1.提取当前二级分类数据
    • 2.渲染二级分类
    • 2.渲染商品
  • 四、骨架屏
    • 1.微信开发者工具
    • 2.生成骨架屏
    • 3.调整为vue组件
  • 方便开发的操作


前言

效果图如下:
在这里插入图片描述

一、新建分类组件

在pages里新建文件夹category——> category.vue,在pages.json配置路由,如下
在这里插入图片描述
在这里插入图片描述

1.轮播图效果

轮播图组件:因轮播图用于多处(首页和分类页),需要封装成通用组件,故放于公共页面components——> XtxSwiper.vue
自动导入全局组件:将公用的Xtx开头组件配置自动导入,在pages.json
在这里插入图片描述
全局组件类型声明
在这里插入图片描述
接口请求封装


http://www.ppmy.cn/ops/154412.html

相关文章

未来无线技术的发展方向

未来无线技术的发展趋势呈现出多样化、融合化的特点,涵盖速度、覆盖范围、应用领域、频段利用、安全性等多个方面。这些趋势将深刻改变人们的生活和社会的运行方式。 传输速度提升:Wi-Fi 技术迭代加快,如 Wi-Fi7 理论峰值速率达 46Gbps&#…

Kafka 压缩算法详细介绍

文章目录 一 、Kafka 压缩算法概述二、Kafka 压缩的作用2.1 降低网络带宽消耗2.2 提高 Kafka 生产者和消费者吞吐量2.3 减少 Kafka 磁盘存储占用2.4 减少 Kafka Broker 负载2.5 降低跨数据中心同步成本 三、Kafka 压缩的原理3.1 Kafka 压缩的基本原理3.2. Kafka 压缩的工作流程…

C++ —— 智能指针 unique_ptr (上)

C —— 智能指针 unique_ptr (上) 普通指针的不足普通指针的释放智能指针智能指针 unique_ptr智能指针初始化错误用法get()方法返回裸指针智能指针不支持指针的运算(、-、、- -) 普通指针的不足 new和new [] 的内存需要用delete和…

搜索引擎快速收录:关键词布局的艺术

本文来自:百万收录网 原文链接:https://www.baiwanshoulu.com/21.html 搜索引擎快速收录中的关键词布局,是一项既精细又富有策略性的工作。以下是对关键词布局艺术的详细阐述: 一、关键词布局的重要性 关键词布局影响着后期页面…

redis的分片集群模式

redis的分片集群模式 1 主从哨兵集群的问题和分片集群特点 主从哨兵集群可应对高并发写和高可用性,但是还有2个问题没有解决: (1)海量数据存储 (2)高并发写的问题 使用分片集群可解决,分片集群…

vim操作简要记录

操作容易忘记,记录一下基本使用的 :wq保存退出 :w :q :q! :wq! i I a A 方向键 h左 j下 k上 l右 dd删除方行(这其实是剪切行操作,不过一般用作删除,长按可删除,不过按.执行上一次操作删除更快) .执行上…

LeetCode 0040.组合总和 II:回溯 + 剪枝

【LetMeFly】40.组合总和 II:回溯 剪枝 力扣题目链接:https://leetcode.cn/problems/combination-sum-ii/ 给定一个候选人编号的集合 candidates 和一个目标数 target ,找出 candidates 中所有可以使数字和为 target 的组合。 candidates…

使用Ollama和Open WebUI快速玩转大模型:简单快捷的尝试各种llm大模型,比如DeepSeek r1

Ollama本身就是非常优秀的大模型管理和推理组件,再使用Open WebUI更加如虎添翼! Ollama快速使用指南 安装Ollama Windows下安装 下载Windows版Ollama软件:Release v0.5.7 ollama/ollama GitHub 下载ollama-windows-amd64.zip这个文件即可…