当前位置： 首页 > news >正文

微信小程序教程011-3：京西购物商城实战之Home页实现

news 2026/2/7 14:18:48

文章目录

  • 3、首页
    • 3.0 创建home分支
    • 3.1 配置网络请求
    • 3.2 轮播图区域
      • 3.2.1 请求轮播图的数据
      • 3.2.2 渲染轮播图的UI结构
      • 3.2.3 配置小程序分包
      • 3.2.4 点击轮播图跳转到商品详情页
      • 3.2.5 封装 uni.$showMsg() 方法
    • 3.3 分类导航区域
      • 3.3.1 获取分类导航的数据
      • 3.3.2 渲染分类导航的UI结构
      • 3.3.2 点击第一项，切换到分类页面
    • 3.4 楼层区域
      • 3.4.1 获取楼层数据
      • 3.4.2 渲染楼层标题
      • 3.4.3 渲染楼层里的图片
      • 3.4.4 点击楼层图片跳转到商品列表页
    • 3.5 分支的合并与提交

3、首页

3.0 创建home分支

运行如下命令，基于master分支在本地创建home子分支，用来开发和home首页相关的功能：

git checkout -b home
git branch

在这里插入图片描述

3.1 配置网络请求

由于平台限制，小程序项目不支持axios，而且原生的wx.request()API功能简单，不支持拦截器等全局制定功能，因此，建议在uni-app项目中使用@escook/request-miniprogram第三方包发起网络请求。

官方地址：https://www.npmjs.com/package/@escook/request-miniprogram

1、安装，在项目根目录，打开cmd运行以下命令：

相关文章：

微信小程序教程011-3：京西购物商城实战之Home页实现

文章目录 3、首页3.0 创建home分支3.1 配置网络请求3.2 轮播图区域3.2.1 请求轮播图的数据3.2.2 渲染轮播图的UI结构3.2.3 配置小程序分包3.2.4 点击轮播图跳转到商品详情页3.2.5 封装 uni.$showMsg() 方法3.3 分类导航区域3.3.1 获取分类导航的数据3.3.2 渲染分类导航的UI结构…...

编程日记 2024/8/7 8:22:18

使用 Manim 创建一个二维坐标平面【NumberPlane】

NumberPlane 是 Manim 中用于创建一个二维坐标平面的类。它可以帮助用户在场景中可视化坐标轴、网格线以及其他数学概念。具体来说，它的功能包括： 坐标轴：NumberPlane 提供了 x 轴和 y 轴，通常是中心对称的，允许用户清…...

编程日记 2024/8/7 8:21:16

Android.mk（TODO）

Android.mk 文件是 Android 构建系统（基于 GNU Make）的一个核心部分，用于定义如何构建项目中的模块。在 Android 中，Android.mk 文件主要用于描述本地模块（如库、可执行文件等）的构建信息。以下是 Android.…...

编程日记 2024/8/7 8:19:14

WPF datagrid 选中某一行后让第一列的checkbox选中

在 WPF 中的 DataGrid 中，如果希望在选中某一行后让该行的第一列中的 CheckBox 选中，可以通过绑定和事件处理来实现。以下是具体的步骤： 绑定数据：确保 DataGrid 的数据源绑定到一个支持 INotifyPropertyChanged 接口的集合。模板…...

编程日记 2024/8/7 8:18:13

洛谷 P1347 排序（福建省历届夏令营）（图论：拓扑排序）

题目描述 一个不同的值的升序排序数列指的是一个从左到右元素依次增大的序列&#xff0c;例如&#xff0c;一个有序的数列 A,B,C,D表示 A<B,B<C,C<D。在这道题中&#xff0c;我们将给你一系列形如 A<B的关系&#xff0c;并要求你判断是否能够根据这些关系确定这个…...

编程日记 2024/8/7 8:17:11

Redis 缓存击穿、穿透、雪崩

1. 缓存击穿 问题描述&#xff1a; 缓存击穿是指缓存中没有但数据库中有的数据&#xff08;一般是缓存时间到期&#xff09;&#xff0c;这时由于并发用户特别多&#xff0c;同时读缓存没读到数据&#xff0c;又都去数据库去取数据&#xff0c;引起数据库压力瞬间增大&#xf…...

编程日记 2024/8/7 8:14:07

使用开源RustDesk部署远程控制服务

使用开源RustDesk部署远程控制服务 文档编写时间&#xff1a;2024/8/1 一、部署环境 操作系统&#xff1a;Ubuntu 2204 LTS IP地址&#xff1a;192.168.108.115 开源软件项目地址&#xff1a;rustdesk/rustdesk-server: RustDesk Server Program (github.com) 参考文档&a…...

编程日记 2024/8/7 8:13:06

Coco-LIC基于ubuntu的vscode进行断点调试

1、下vscode和插件 参考这个也行 https://zhuanlan.zhihu.com/p/704522656 2、编译debug版本并修改json 要在 Visual Studio Code (VSCode) 中进行断点调试 ROS 任务&#xff0c;你需要进行以下几个步骤&#xff1a; ### 1. 安装所需插件 - **C/C 插件**: 提供对 C 代码的调试…...

编程日记 2024/8/7 8:12:04

【Web】从TFCCTF-FUNNY浅析PHPCGI命令行注入漏洞利用

目录 背景 CVE-2012-1823 发散利用 法一&#xff1a;读文件 法二&#xff1a;数据外带 背景 CVE-2012-1823 PHP-CGI远程代码执行漏洞&#xff08;CVE-2012-1823&#xff09;分析 | 离别歌 省流&#xff1a; 命令行参数不光可以通过#!/usr/local/bin/php-cgi -d include…...

编程日记 2024/8/7 8:09:01

对比一下在 OpenCV 和 AE 中如何实现常用效果 [精]

确实&#xff0c;Adobe After Effects (AE) 也是一个功能强大的工具&#xff0c;特别擅长处理图像和视频的视觉效果和动画。很多在 OpenCV 中实现的图像处理和增强效果&#xff0c;AE 也可以轻松完成&#xff0c;甚至以更加直观的方式实现。下面对比一下在 OpenCV 和 AE 中如何…...

编程日记 2024/8/7 8:08:00

docker安装及使用

一、docker优点及作用 优点&#xff1a; 基础镜像MB级别创建简单隔离性强启动速度秒级移植与分享放便 作用&#xff1a;资源隔离 cpu、memory资源隔离与限制访问设备隔离与限制网络隔离与限制用户、用户组隔离限制 二、docker安装 2.1.配置yum源 yum install -y yum-uti…...

编程日记 2024/8/7 8:06:59

HTML前端面试基础（一）

HTML面试题可以涵盖多个方面&#xff0c;包括HTML基础、HTML5新特性、标签语义化、元素分类、属性理解等。以下是一些常见的HTML面试题及其简要答案&#xff1a; 1. HTML基础 问题&#xff1a; 请解释一下HTML文档的基本结构。 答案&#xff1a; HTML文档的基本结构包括<…...

编程日记 2024/8/7 8:05:58

[Git][多人协作][下]详细讲解

目录 1.不同分支下多人协作2.远程分⽀删除后&#xff0c;本地git branch -a依然能看到 1.不同分支下多人协作 ⼀般情况下&#xff0c;如果有多需求需要多⼈同时进⾏开发&#xff0c;是不会在⼀个分⽀上进⾏多⼈开发&#xff0c;⽽是⼀个需求或⼀个功能点就要创建⼀个feature分…...

编程日记 2024/8/7 8:04:56

MySQL笔记（七）：索引

一、索引优化速度 创建对应字段的索引&#xff0c;只对该列有效&#xff0c;只能提高该列的查询速度 创建索引后&#xff0c;查询速度变快&#xff0c;但是表占用空间变大 create index 索引名 on 表名(需要创建索引的列)二、索引的原理 普通索引允许该字段重复 全文索引&#…...

编程日记 2024/8/7 8:01:53

JS 原型和原型链

构造函数 封装是面向对象思想中比较重要的一部分&#xff0c;js 面向对象可以通过构造函数实现的封装。 同样的将变量和函数组合到了一起并能通过 this 实现数据的共享&#xff0c;所不同的是 JS 借助构造函数创建出来的实例对象之间是彼此不影响的 存在浪费内存的问题&#…...

编程日记 2024/8/7 7:59:51

【无标题】图像增强技术：直方图均衡化、拉普拉斯算子、对数变换与伽马变换

图像增强技术&#xff1a;直方图均衡化、拉普拉斯算子、对数变换与伽马变换 在图像处理领域&#xff0c;图像增强是一种关键技术&#xff0c;用于提升图像的视觉效果和质量。本文将介绍四种常用的图像增强方法&#xff1a;直方图均衡化、拉普拉斯算子、对数变换和伽马变换。我…...

编程日记 2024/8/7 7:56:49

自动化专业英语

前言 电子信息、电气工程、自动化专业英语词汇汇总&#xff0c;不定期更新 常用 Asynchronous&#xff1a;异步synchronous&#xff1a;同步notification&#xff1a;通知blade&#xff1a;平面shaft&#xff1a;轴magnetic&#xff1a;磁场的bearing&#xff1a;轴承valve&…...

编程日记 2024/8/7 7:55:47

如何使用 Python 进行数据可视化，比如绘制折线图？

要使用Python进行数据可视化&#xff0c;可以使用matplotlib库来绘制折线图。以下是一个简单的示例代码&#xff1a; 首先&#xff0c;确保已安装matplotlib库。可以使用以下命令安装&#xff1a; pip install matplotlib在Python脚本中导入matplotlib库&#xff1a; import…...

编程日记 2024/8/7 7:53:45

PostgreSQL数据库的事务ID和事务机制

PostgreSQL后续简称PG。PG只读事务不会分配事务ID。为了在共享锁等情况下对事务进行标识&#xff0c;需要一种非持久化的事务ID&#xff0c;即虚拟事务ID&#xff0c;vxid。虚拟事务ID不需要把事务ID持久化到磁盘。因为事务ID是很宝贵的资源&#xff0c;简单的select语句不会申…...

编程日记 2024/8/7 7:52:45

LeetCode 热题 HOT 100 （020/100）【宇宙最简单版】[创作中]

【链表】No. 0142 环形链表 II【中等】&#x1f449;力扣对应题目指路 希望对你有帮助呀&#xff01;&#xff01;&#x1f49c;&#x1f49c; 如有更好理解的思路&#xff0c;欢迎大家留言补充 ~ 一起加油叭 &#x1f4a6; 欢迎关注、订阅专栏 【力扣详解】谢谢你的支持&#…...

编程日记 2024/8/7 7:51:43

Python｜GIF 解析与构建（5）：手搓截屏和帧率控制

目录 Python&#xff5c;GIF 解析与构建&#xff08;5&#xff09;&#xff1a;手搓截屏和帧率控制 一、引言 二、技术实现&#xff1a;手搓截屏模块 2.1 核心原理 2.2 代码解析&#xff1a;ScreenshotData类 2.2.1 截图函数&#xff1a;capture_screen 三、技术实现&…...

编程新知 2025/11/14 3:06:30

【Java学习笔记】Arrays类

Arrays 类 1. 导入包&#xff1a;import java.util.Arrays 2. 常用方法一览表 方法描述Arrays.toString()返回数组的字符串形式Arrays.sort()排序&#xff08;自然排序和定制排序&#xff09;Arrays.binarySearch()通过二分搜索法进行查找&#xff08;前提&#xff1a;数组是…...

编程新知 2025/12/3 9:38:15

基于uniapp+WebSocket实现聊天对话、消息监听、消息推送、聊天室等功能，多端兼容

基于 ​UniApp + WebSocket​实现多端兼容的实时通讯系统，涵盖WebSocket连接建立、消息收发机制、多端兼容性配置、消息实时监听等功能，适配​微信小程序、H5、Android、iOS等终端 目录 技术选型分析WebSocket协议优势UniApp跨平台特性WebSocket 基础实现连接管理消息收发连接…...

编程新知 2026/1/22 16:15:42

可靠性+灵活性：电力载波技术在楼宇自控中的核心价值

可靠性灵活性&#xff1a;电力载波技术在楼宇自控中的核心价值 在智能楼宇的自动化控制中&#xff0c;电力载波技术&#xff08;PLC&#xff09;凭借其独特的优势&#xff0c;正成为构建高效、稳定、灵活系统的核心解决方案。它利用现有电力线路传输数据&#xff0c;无需额外布…...

编程新知 2025/9/27 2:43:26

Python爬虫（二）：爬虫完整流程

爬虫完整流程详解&#xff08;7大核心步骤实战技巧&#xff09; 一、爬虫完整工作流程 以下是爬虫开发的完整流程&#xff0c;我将结合具体技术点和实战经验展开说明&#xff1a; 1. 目标分析与前期准备 网站技术分析&#xff1a; 使用浏览器开发者工具&#xff08;F12&…...

编程新知 2025/10/19 5:48:51

【JavaSE】绘图与事件入门学习笔记

-Java绘图坐标体系 坐标体系-介绍 坐标原点位于左上角&#xff0c;以像素为单位。 在Java坐标系中,第一个是x坐标,表示当前位置为水平方向&#xff0c;距离坐标原点x个像素;第二个是y坐标&#xff0c;表示当前位置为垂直方向&#xff0c;距离坐标原点y个像素。 坐标体系-像素 …...

编程新知 2025/12/19 20:46:15

RNN避坑指南：从数学推导到LSTM/GRU工业级部署实战流程

本文较长&#xff0c;建议点赞收藏&#xff0c;以免遗失。更多AI大模型应用开发学习视频及资料&#xff0c;尽在聚客AI学院。 本文全面剖析RNN核心原理&#xff0c;深入讲解梯度消失/爆炸问题&#xff0c;并通过LSTM/GRU结构实现解决方案&#xff0c;提供时间序列预测和文本生成…...

编程新知 2026/1/20 17:16:46

C# 求圆面积的程序（Program to find area of a circle）

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...

编程新知 2026/1/21 14:21:52

【网络安全】开源系统getshell漏洞挖掘

审计过程&#xff1a; 在入口文件admin/index.php中&#xff1a; 用户可以通过m,c,a等参数控制加载的文件和方法&#xff0c;在app/system/entrance.php中存在重点代码&#xff1a; 当M_TYPE system并且M_MODULE include时&#xff0c;会设置常量PATH_OWN_FILE为PATH_APP.M_T…...

编程新知 2026/1/31 2:59:25

从物理机到云原生：全面解析计算虚拟化技术的演进与应用

前言&#xff1a;我的虚拟化技术探索之旅 我最早接触"虚拟机"的概念是从Java开始的——JVM&#xff08;Java Virtual Machine&#xff09;让"一次编写&#xff0c;到处运行"成为可能。这个软件层面的虚拟化让我着迷&#xff0c;但直到后来接触VMware和Doc…...

编程新知 2026/2/6 6:02:06