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

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

news 2025/6/28 10:30:37

文章目录

  • 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

Leetcode 3576. Transform Array to All Equal Elements

Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接&#xff1a;3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到&#xf…...

编程新知 2025/6/25 2:24:39

简易版抽奖活动的设计技术方案

1.前言 本技术方案旨在设计一套完整且可靠的抽奖活动逻辑，确保抽奖活动能够公平、公正、公开地进行，同时满足高并发访问、数据安全存储与高效处理等需求，为用户提供流畅的抽奖体验，助力业务顺利开展。本方案将涵盖抽奖活动的整体架构设计、核心流程逻辑、关键功能实现以及…...

编程新知 2025/6/25 13:36:32

QMC5883L的驱动

简介 本篇文章的代码已经上传到了github上面&#xff0c;开源代码 作为一个电子罗盘模块&#xff0c;我们可以通过I2C从中获取偏航角yaw&#xff0c;相对于六轴陀螺仪的yaw&#xff0c;qmc5883l几乎不会零飘并且成本较低。 参考资料 QMC5883L磁场传感器驱动 QMC5883L磁力计…...

编程新知 2025/6/21 13:57:28

ssc377d修改flash分区大小

1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...

编程新知 2025/6/18 5:34:10

【第二十一章 SDIO接口(SDIO)】

第二十一章 SDIO接口 目录 第二十一章 SDIO接口(SDIO) 1 SDIO 主要功能 2 SDIO 总线拓扑 3 SDIO 功能描述 3.1 SDIO 适配器 3.2 SDIOAHB 接口 4 卡功能描述 4.1 卡识别模式 4.2 卡复位 4.3 操作电压范围确认 4.4 卡识别过程 4.5 写数据块 4.6 读数据块 4.7 数据流…...

编程新知 2025/6/25 1:21:34

oracle与MySQL数据库之间数据同步的技术要点

Oracle与MySQL数据库之间的数据同步是一个涉及多个技术要点的复杂任务。由于Oracle和MySQL的架构差异&#xff0c;它们的数据同步要求既要保持数据的准确性和一致性&#xff0c;又要处理好性能问题。以下是一些主要的技术要点&#xff1a; 数据结构差异 数据类型差异&#xff…...

编程新知 2025/6/25 2:09:15

如何在最短时间内提升打ctf（web)的水平？

刚刚刷完2遍 bugku 的 web 题&#xff0c;前来答题。 每个人对刷题理解是不同&#xff0c;有的人是看了writeup就等于刷了&#xff0c;有的人是收藏了writeup就等于刷了&#xff0c;有的人是跟着writeup做了一遍就等于刷了&#xff0c;还有的人是独立思考做了一遍就等于刷了。…...

编程新知 2025/6/23 2:47:18

Unsafe Fileupload篇补充-木马的详细教程与木马分享（中国蚁剑方式）

在之前的皮卡丘靶场第九期Unsafe Fileupload篇中我们学习了木马的原理并且学了一个简单的木马文件 本期内容是为了更好的为大家解释木马&#xff08;服务器方面的&#xff09;的原理&#xff0c;连接&#xff0c;以及各种木马及连接工具的分享 文件木马&#xff1a;https://w…...

编程新知 2025/6/26 0:39:04

解读《网络安全法》最新修订，把握网络安全新趋势

《网络安全法》自2017年施行以来&#xff0c;在维护网络空间安全方面发挥了重要作用。但随着网络环境的日益复杂&#xff0c;网络攻击、数据泄露等事件频发&#xff0c;现行法律已难以完全适应新的风险挑战。 2025年3月28日&#xff0c;国家网信办会同相关部门起草了《网络安全…...

编程新知 2025/6/26 9:04:15

比较数据迁移后MySQL数据库和OceanBase数据仓库中的表

设计一个MySQL数据库和OceanBase数据仓库的表数据比较的详细程序流程，两张表是相同的结构，都有整型主键id字段，需要每次从数据库分批取得2000条数据，用于比较，比较操作的同时可以再取2000条数据，等上一次比较完成之后，开始比较，直到比较完所有的数据。比较操作需要比较…...

编程新知 2025/6/25 4:33:04