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

微信小程序教程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结构
      • 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结构…...

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

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

Android.mk(TODO)

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

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

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

洛谷 P1347 排序(福建省历届夏令营)(图论:拓扑排序)

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

Redis 缓存击穿、穿透、雪崩

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

使用开源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…...

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 代码的调试…...

【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…...

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

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

docker安装及使用

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

HTML前端面试基础(一)

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

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

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

MySQL笔记(七):索引

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

JS 原型和原型链

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

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

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

自动化专业英语

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

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

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

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

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

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

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

第19节 Node.js Express 框架

Express 是一个为Node.js设计的web开发框架&#xff0c;它基于nodejs平台。 Express 简介 Express是一个简洁而灵活的node.js Web应用框架, 提供了一系列强大特性帮助你创建各种Web应用&#xff0c;和丰富的HTTP工具。 使用Express可以快速地搭建一个完整功能的网站。 Expre…...

Qt/C++开发监控GB28181系统/取流协议/同时支持udp/tcp被动/tcp主动

一、前言说明 在2011版本的gb28181协议中&#xff0c;拉取视频流只要求udp方式&#xff0c;从2016开始要求新增支持tcp被动和tcp主动两种方式&#xff0c;udp理论上会丢包的&#xff0c;所以实际使用过程可能会出现画面花屏的情况&#xff0c;而tcp肯定不丢包&#xff0c;起码…...

三维GIS开发cesium智慧地铁教程(5)Cesium相机控制

一、环境搭建 <script src"../cesium1.99/Build/Cesium/Cesium.js"></script> <link rel"stylesheet" href"../cesium1.99/Build/Cesium/Widgets/widgets.css"> 关键配置点&#xff1a; 路径验证&#xff1a;确保相对路径.…...

P3 QT项目----记事本(3.8)

3.8 记事本项目总结 项目源码 1.main.cpp #include "widget.h" #include <QApplication> int main(int argc, char *argv[]) {QApplication a(argc, argv);Widget w;w.show();return a.exec(); } 2.widget.cpp #include "widget.h" #include &q…...

【单片机期末】单片机系统设计

主要内容&#xff1a;系统状态机&#xff0c;系统时基&#xff0c;系统需求分析&#xff0c;系统构建&#xff0c;系统状态流图 一、题目要求 二、绘制系统状态流图 题目&#xff1a;根据上述描述绘制系统状态流图&#xff0c;注明状态转移条件及方向。 三、利用定时器产生时…...

论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(一)

宇树机器人多姿态起立控制强化学习框架论文解析 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架&#xff08;一&#xff09; 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化…...

【Oracle】分区表

个人主页&#xff1a;Guiat 归属专栏&#xff1a;Oracle 文章目录 1. 分区表基础概述1.1 分区表的概念与优势1.2 分区类型概览1.3 分区表的工作原理 2. 范围分区 (RANGE Partitioning)2.1 基础范围分区2.1.1 按日期范围分区2.1.2 按数值范围分区 2.2 间隔分区 (INTERVAL Partit…...

高效线程安全的单例模式:Python 中的懒加载与自定义初始化参数

高效线程安全的单例模式:Python 中的懒加载与自定义初始化参数 在软件开发中,单例模式(Singleton Pattern)是一种常见的设计模式,确保一个类仅有一个实例,并提供一个全局访问点。在多线程环境下,实现单例模式时需要注意线程安全问题,以防止多个线程同时创建实例,导致…...

R语言速释制剂QBD解决方案之三

本文是《Quality by Design for ANDAs: An Example for Immediate-Release Dosage Forms》第一个处方的R语言解决方案。 第一个处方研究评估原料药粒径分布、MCC/Lactose比例、崩解剂用量对制剂CQAs的影响。 第二处方研究用于理解颗粒外加硬脂酸镁和滑石粉对片剂质量和可生产…...

IP如何挑?2025年海外专线IP如何购买?

你花了时间和预算买了IP&#xff0c;结果IP质量不佳&#xff0c;项目效率低下不说&#xff0c;还可能带来莫名的网络问题&#xff0c;是不是太闹心了&#xff1f;尤其是在面对海外专线IP时&#xff0c;到底怎么才能买到适合自己的呢&#xff1f;所以&#xff0c;挑IP绝对是个技…...