uni-app网络请求、数据缓存实例详解
作者:Bonsoir777 发布时间:2023-08-09 03:49:12
标签:uni-app,网络请求,数据缓存
一、网络请求
在uni中可以调用uni.request方法进行请求网络请求
需要注意的是:在小程序中网络相关的 API 在使用前需要配置域名白名单。
1.配置请求
以下为发送网络请求的基本配置,可根据接口请求数据方法的不同,以不同的方式请求数据。
// #ifdef H5
var baseURL = "/api"
// #endif
// #ifndef H5
var baseURL = "http://81.68.254.47/api"
// #endif
var request = function(options){
return new Promise((resolve,reject)=>{
uni.request({
url:baseURL+options.url,
method:options.method||'GET',
data:options.data||{},
dataType:options.dataType||'json',
success: (res) => {
resolve(res.data)
},
fail: (err) => {
reject(err)
}
})
})
}
export default request
1.1 发送get请求
// 引入request请求方法
import request from '../utils/request.js';
// 请求首页基础数据的方法
export const getHome = ( )=>{
return request({
url:'/index_category/data'
})
}
1.2 发送POST请求
// 引入request请求方法
import request from '../utils/request.js';
// 获取首页指定分类下的分页数据
export const getChoose = ({title,page,all,sale_count,min_price})=>{
return request({
url:'/goods/search',
method:'POST',
data:{title,page,all,sale_count,min_price}
})
}
二、数据缓存
1.uni.setStorage(OBJECT)
将数据存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容,这是一个异步接口。
OBJECT参数说明:
参数名 | 类型 | 必填 | 说明 |
key | String | 是 | 本地缓存中的指定的key |
data | Any | 是 | 需要存储的内容,只支持原生类型,及能够通过JSON.stringfiy序列化的对象。 |
success | Function | 否 | 接口调用成功的回调函数 |
falil | Function | 否 | 接口调用失败的回调函数 |
complete | Function | 否 | 接口调用结束的回调函数(调用失败,成功都会执行) |
2.uni.setStorageSync(KEY,DATA)
将 data 存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容,这是一个同步接口。
参数说明:
参数名 | 类型 | 必填 | 说明 |
key | String | 是 | 本地缓存中的指定的key |
data | Any | 是 | 需要存储的内容,只支持原生类型,及能够通过JSON.stringfiy序列化的对象。 |
3.uni.getStorage(OBJECT)
从本地缓存中异步获取指定 key 对应的内容。
OBJECT参数说明:
参数名 | 类型 | 必填 | 说明 |
key | String | 是 | 本地缓存中的指定的key |
data | Any | 是 | 接口调用的回调函数,res = {data: key对应的内容} |
success | Function | 否 | 接口调用成功的回调函数 |
falil | Function | 否 | 接口调用失败的回调函数 |
4.uni.getStorageSync(KEY)
从本地缓存中同步获取指定 key 对应的内容。
参数说明:
参数名 | 类型 | 必填 | 说明 |
key | String | 是 | 本地缓存中的指定的key |
5.uni.removeStorage(OBJECT)
从本地缓存中异步移除指定 key。
OBJECT 参数说明:
参数名 | 类型 | 必填 | 说明 |
key | String | 是 | 本地缓存中的指定的key |
success | Function | 否 | 接口调用成功的回调函数 |
falil | Function | 否 | 接口调用失败的回调函数 |
complete | Function | 否 | 接口调用结束的回调函数(调用失败,成功都会执行) |
来源:https://blog.csdn.net/Bonsoir777/article/details/127770920
0
投稿
猜你喜欢
- 在蓝色看到的几个js日历代码,整理了一下。大家可以用在blog上,或者可以用在表单的日期类型的数据选择中,方便大家填写日期。1.动感的日历,
- 学习目的:掌握下拉列表框的用法,并理解AutoPostBack属性; 理解IsPoskBack及用法; 初识DataTable的
- 使用“发送测试电子邮件”对话框来测试使用特定配置文件发送邮件的能力。过程发送测试电子邮件1.使用对象
- 可以在Mac OS X 10.2.x(“Jaguar”)和以上版本上Mac OS X使用二进制安装软
- 在http规则中用404来表示某个页面不能访问,一般来说,网站的404错误页面都是IIS或APACHE默认的页面,千篇一律,非常单调。由于可
- HTML 5 和 XHTML 2规范草稿公布以来,一直存在很大的争议。HTML 5是由包括Google、Mirosoft、Mozilla、O
- 在 MySQL 下,在进行中文模糊检索时,经常会返回一些与之不相关的记录,如查找 "%a%" 时,返回的可能有中文字符,
- 1、800*600下,网页宽度保持在778以内,就不会出现水平滚动条,高度则视版面和内容决定。2、1024*768下,网页宽度保持在1002
- 首先,我们会document里添加mouseover事件时在HTMLElement上飘一个absolute的容器,设置border。接着,m
- 平面设计 常用尺寸 三折页广告 标准尺寸: (A4)210mm x 285mm普通宣传册 标准尺寸: (A4)210mm x 285mm文件
- 这个代码不是很完善,能实现基本的功能;另外有个问题,就是divOpenWin层的定位问题:发现如果其属性设置成display:none,那么
- 虽然大多数web文档的顶部都有doctype声明,但很多人都没有注意它。它是在你新建一个文档时,由web创作软件草率处理的众多细节之一。虽然
- 第一次写这类文章,有点儿紧张有点儿新奇有点儿痛苦,来CDC实习2个月啦,每天除了工作就是体验体验再体验,因为之前做了一些有关规范的工作,突然
- MySQL的命令行提示符及其表达的意思mysql> 准备好接受新命令。 &n
- gonews是基于 go+vue 实现的golang每日新闻浏览与检索平台项目地址: Github线上Demo:GoNews数据来源: Go
- 看youa的源码发现的,原来flash可以有fallback content:<object type="applicati
- 今天突然想起这个问题, 就好好搜索整理一下,不过在开始归纳之前,请先来一起做做这个小实验:忽略一切实际的外在情况, 你看了下面的按钮,第一本
- 一:操作redis1:redis拓展安装composer require predis/predis或者你也可以通过 PECL 安装&nbs
- Microsoft SQL Server 7.0安全问题Microsoft Corporation【「Microsoft SQL Serve
- 可扩展标记语言 (XML) 是用于描述数据集内容以及应如何将数据输出到设备上或如何在 Web 页上显示数据的语言。标记语言的创建来源于出版商