uniapp 配置网络请求并使用请求轮播图
由于平台的限制,小程序项目中不支持 axios,而且原生的 wx.request() API 功能较为简单,不支持拦截器等全局定制的功能。因此,建议在 uni-app 项目中使用 @escook/request-miniprogram 第三方包发起网络数据请求。
官方文档:@escook/request-miniprogram - npm (npmjs.com)
-
1、安装 相应的包

1、安装一个npm包管理文件:
npm init -y2、安装我们这个网络请求第三方工具
npm i @escook/request-miniprogram

-
2、导入 $http 对象
import { $http } from '@escook/request-miniprogram'uni.$http = $http

-
3、配置 请求根路径、请求拦截器
// 2、配置请求根路径
$http.baseUrl = 'https://api-hmugo-web.itheima.net'// 3、请求开始之前做一些事情
$http.beforeRequest = function (options) {uni.showLoading({title: '数据加载中...',})
}// 4、请求完成之后做一些事情
$http.afterRequest = function () {uni.hideLoading()
}

-
4、使用 网络请求
先在pages下建立需要的文件夹,再在这些文件夹上右键点击新建页面,创建就行

<template><view><!-- 轮播图区域 --><swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" :circular="true"><!-- 循环渲染轮播图的 item 项 --><swiper-item v-for="(item, i) in swiperList" :key="i"><view class="swiper-item"><!-- 动态绑定图片的 src 属性 --><image :src="item.image_src"></image></view></swiper-item></swiper></view>
</template><script>export default {data() {return {// 1. 轮播图的数据列表,默认为空数组swiperList: [],}},onLoad() {// 2. 在小程序页面刚加载的时候,调用获取轮播图数据的方法this.getSwiperList()},methods: {// 3. 获取轮播图数据的方法async getSwiperList() {// 3.1 发起请求 【把data从res{data}中解构出来】const {data: res} = await uni.$http.get('/api/public/v1/home/swiperdata')console.log(res);// 3.2 请求失败if (res.meta.status !== 200) {return uni.showToast({title: '数据请求失败!',duration: 1500,icon: 'none',})}// 3.3 请求成功,为 data 中的数据赋值this.swiperList = res.message},},}
</script><style lang="scss">swiper {height: 330rpx;.swiper-item,image {width: 100%;height: 100%;}}
</style>
相关文章:
uniapp 配置网络请求并使用请求轮播图
由于平台的限制,小程序项目中不支持 axios,而且原生的 wx.request() API 功能较为简单,不支持拦截器等全局定制的功能。因此,建议在 uni-app 项目中使用 escook/request-miniprogram 第三方包发起网络数据请求。 官方文档…...
c#在MVC Api(.net framework)当中使用Swagger,以及Demo下载
主要的步骤就是创建项目,通过nuget 添加Swashbuckle包,然后在SwaggerConfig当中进行相关的配置。 具体的步骤,可以参考下面的链接: https://www.cnblogs.com/94pm/p/8046580.htmlhttps://blog.csdn.net/xiaouncle/article/detail…...
Linux 常见命令操作
一、目录管理 1.1 列出目录 ls # ls 命令 # -a 参数,查看全部的文件,包括隐藏的文件 # -l 参数,列出所有的文件,包括文件的属性和权限,不显示隐藏文件 [rootlocalhost /]# ls bin boot dev etc home lib lib64…...
前端实习第七周周记
前言 第六周没写,是因为第六周的前两天在处理第五周的样本库部分。问题解决一个是嵌套问题(因为我用到了递归),还有一个问题在于本机没有问题,打包上线接口404。这个问题我会在这周的总结中说。 第六周第三天才谈好新…...
DevOps理念:开发与运维的融合
在现代软件开发领域,DevOps 不仅仅是一个流行的词汇,更是一种文化、一种哲学和一种方法论。DevOps 的核心理念是通过开发和运维之间的紧密合作,实现快速交付、高质量和持续创新。本文将深入探讨 DevOps 文化的重要性、原则以及如何在团队中实…...
windows下Mysql安装配置教程
Mysql下载 在官网下载mysql community Server https://dev.mysql.com/downloads/mysql/ 可以选择下载压缩包或者MSI安装程序 使用压缩包安装 MySQL 压缩包安装通常需要以下步骤: 1. 下载 MySQL 安装包 你可以从 MySQL 官网上下载适合你系统的 MySQL 安装包&am…...
[开发|java] activeJdbc的model的isModified方法说明
在 ActiveJDBC 中,每个数据库表都对应一个继承自 org.javalite.activejdbc.Model 的类,该类用于表示数据库表中的记录。这些类允许您以面向对象的方式与数据库交互。 import org.javalite.activejdbc.Model;public class User extends Model {static {v…...
23062day6
作业:将dict.txt导入到数据库中。 方法1:创建shell脚本, 调用指令创建数据库和表格,使用循环在循环中用数组存储dict.txt的内容并插入表格中。 方法2:在终端创建数据库和表格,将dict.txt中的内容手动输入…...
MiniExcel
MiniExcel 是一个在 .NET 平台上用于操作 Excel 文件的库。它的特点是轻量级、简单易用,并且支持读取和写入 Excel 文件的功能。 使用 MiniExcel 可以进行以下操作: 读取 Excel 文件的数据,并将其转换为多维数组或实体对象。将多维数组或实…...
全球公链进展| Shibarium重新开放跨链桥提款;USDC计划在Polygon PoS等 6 个新区块链上推出
一周速览 过去一周,明星项目动态如下: Holesky 公共测试网创世文件已生成 Shibarium主网重新开放跨链桥提款 BNB Greenfield 测试网将于 8 月 31 日重置 BNB Smart Chain(BEP20)将进行网络升级及硬分叉 USDC 将在6个新区块链…...
关于C# halcon内存泄漏的研究
开发环境:Win7 VS2002 halcon12, 直接运行Debug的exe 不释放 private void butTemp_Click(object sender, EventArgs e) { HOperatorSet.SetSystem("clip_region", "false"); HObject region; …...
高精度地图定位在高速公路自动驾驶系统中的应用
近年来随着汽车保有量不断增加,随之而来的是: ( 1) 严重的交通拥堵,通行效率低下,用在通行上的时间不断增加; ( 2) 交通事故频发,交通事故导致的伤亡人数和费用不断增加,而且绝大多数事故是由人为因素导致的; ( 3) 大气…...
【Apollo学习笔记】——规划模块TASK之SPEED_HEURISTIC_OPTIMIZER
文章目录 前言SPEED_BOUNDS_PRIORI_DECIDER功能简介SPEED_BOUNDS_PRIORI_DECIDER相关配置SPEED_BOUNDS_PRIORI_DECIDER流程1. 对路程和时间进行采样以及速度限制2. 设计状态转移方程(cost计算)2.0 CalculateCostAt代价计算2.1 GetObstacleCost障碍物cost…...
R语言APRIORI关联规则、K-MEANS均值聚类分析中药专利复方治疗用药规律网络可视化...
全文链接:http://tecdat.cn/?p30605 应用关联规则、聚类方法等数据挖掘技术分析治疗的中药专利复方组方配伍规律(点击文末“阅读原文”获取完整代码数据)。 方法检索治疗中药专利复方,排除外用中药及中西药物合用的复方。最近我们…...
3. MySql 5.7安装方式
服务器ip数据库版本硬件要求10.1.1.31mysql-boost-5.7.31.tar.gz2G/40G,内存不够需要开swap空间10.1.1.32mysql-boost-5.7.31.tar.gz2G/40G关闭swap swapoff -a && sed -i ‘/ swap / s/^(.*)$/#\1/g’ /etc/fstab 安装依赖 yum -y install make cmake gcc gcc-c++ bis…...
Flink 如何定位反压节点?
分析&回答 Flink Web UI 自带的反压监控 —— 直接方式 Flink Web UI 的反压监控提供了 Subtask 级别的反压监控。监控的原理是通过Thread.getStackTrace() 采集在 TaskManager 上正在运行的所有线程,收集在缓冲区请求中阻塞的线程数(意味着下游阻…...
LeetCode-1005-K次取反后最大化的数组和-贪心算法
题目描述: 给你一个整数数组 nums 和一个整数 k ,按以下方法修改该数组: 选择某个下标 i 并将 nums[i] 替换为 -nums[i] 。 重复这个过程恰好 k 次。可以多次选择同一个下标 i 。 以这种方式修改数组后,返回数组 可能的最大和 。 …...
Linux内核源码分析 (5)多处理器调度
Linux内核源码分析 (5)多处理器调度 文章目录 Linux内核源码分析 (5)多处理器调度注:本章节使用的内核版本为Linux 5.6.18一、 SMT和NUMA1、SMP (对称多处理器结构)2、NUMA (非一致内存访问结构) 二、多核调度三、调度域和调度组四、SMP调度详…...
华为云云服务器评测|华为云云耀云服务器L实例使用教学
文章目录 教学小故事 教学 华为云云耀云服务器L实例是一款提供高效、可靠、安全的基础设施服务的云服务器。下面是使用教学: 登录华为云官网。 测评产品链接:https://www.huaweicloud.com/product/hecs-light.html 进入云耀云服务器管理控制台…...
这个在线网站让你三分钟制作出一份精美简历
今天,我要向大家推荐一个神奇的在线工具网站,它能够提供免费简历模板、简历范文,支持在线编辑,并且一键下载为PDF。这个工具让你的简历制作变得轻松便捷! 首先,这个网站的简历模板非常丰富多样。无论你是刚…...
国防科技大学计算机基础课程笔记02信息编码
1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制,因此这个了16进制的数据既可以翻译成为这个机器码,也可以翻译成为这个国标码,所以这个时候很容易会出现这个歧义的情况; 因此,我们的这个国…...
内存分配函数malloc kmalloc vmalloc
内存分配函数malloc kmalloc vmalloc malloc实现步骤: 1)请求大小调整:首先,malloc 需要调整用户请求的大小,以适应内部数据结构(例如,可能需要存储额外的元数据)。通常,这包括对齐调整,确保分配的内存地址满足特定硬件要求(如对齐到8字节或16字节边界)。 2)空闲…...
R语言AI模型部署方案:精准离线运行详解
R语言AI模型部署方案:精准离线运行详解 一、项目概述 本文将构建一个完整的R语言AI部署解决方案,实现鸢尾花分类模型的训练、保存、离线部署和预测功能。核心特点: 100%离线运行能力自包含环境依赖生产级错误处理跨平台兼容性模型版本管理# 文件结构说明 Iris_AI_Deployme…...
SpringCloudGateway 自定义局部过滤器
场景: 将所有请求转化为同一路径请求(方便穿网配置)在请求头内标识原来路径,然后在将请求分发给不同服务 AllToOneGatewayFilterFactory import lombok.Getter; import lombok.Setter; import lombok.extern.slf4j.Slf4j; impor…...
多模态大语言模型arxiv论文略读(108)
CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文标题:CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文作者:Sayna Ebrahimi, Sercan O. Arik, Tejas Nama, Tomas Pfister ➡️ 研究机构: Google Cloud AI Re…...
ArcGIS Pro制作水平横向图例+多级标注
今天介绍下载ArcGIS Pro中如何设置水平横向图例。 之前我们介绍了ArcGIS的横向图例制作:ArcGIS横向、多列图例、顺序重排、符号居中、批量更改图例符号等等(ArcGIS出图图例8大技巧),那这次我们看看ArcGIS Pro如何更加快捷的操作。…...
图表类系列各种样式PPT模版分享
图标图表系列PPT模版,柱状图PPT模版,线状图PPT模版,折线图PPT模版,饼状图PPT模版,雷达图PPT模版,树状图PPT模版 图表类系列各种样式PPT模版分享:图表系列PPT模板https://pan.quark.cn/s/20d40aa…...
Xen Server服务器释放磁盘空间
disk.sh #!/bin/bashcd /run/sr-mount/e54f0646-ae11-0457-b64f-eba4673b824c # 全部虚拟机物理磁盘文件存储 a$(ls -l | awk {print $NF} | cut -d. -f1) # 使用中的虚拟机物理磁盘文件 b$(xe vm-disk-list --multiple | grep uuid | awk {print $NF})printf "%s\n"…...
R语言速释制剂QBD解决方案之三
本文是《Quality by Design for ANDAs: An Example for Immediate-Release Dosage Forms》第一个处方的R语言解决方案。 第一个处方研究评估原料药粒径分布、MCC/Lactose比例、崩解剂用量对制剂CQAs的影响。 第二处方研究用于理解颗粒外加硬脂酸镁和滑石粉对片剂质量和可生产…...
Netty从入门到进阶(二)
二、Netty入门 1. 概述 1.1 Netty是什么 Netty is an asynchronous event-driven network application framework for rapid development of maintainable high performance protocol servers & clients. Netty是一个异步的、基于事件驱动的网络应用框架,用于…...
