uniapp学习（005-3 详解Part.3）

原创于 2024-10-17 17:24:30 发布 · 765 阅读

·

25

·

CC 4.0 BY-SA版权

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

文章标签：

#uni-app #学习 #微信小程序 #小程序 #前端 #vue

uniapp 专栏收录该内容

21 篇文章

订阅专栏

零基础入门uniapp Vue3组合式API版本到咸虾米壁纸项目实战，开发打包微信小程序、抖音小程序、H5、安卓APP客户端等

总时长 23:40:00 共116P

此文章包含第48p-第p51的内容

文章目录

页面和路由API

跳转的两种方式，

1. 使用navigator标签跳转

在这里插入图片描述

2. 使用js代码块进行跳转

在这里插入图片描述
可以带参数

可以看到小程序的参数

onLoad里可以看到参数

tabBar页面无法直接跳转需要改成 reLaunch

在这里插入图片描述

返回上一页 navigateBack

在这里插入图片描述

可以看到当前返回了几页

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

这里可以看出我们打开了两个页面
一个压在另一个加粗样式
在这里插入图片描述

数据缓存API

setStorage 缓存数据到本地 setStorageSync 同步缓存数据到本地

在这里插入图片描述
这里的搜索记录就是前端的缓存

同步缓存异步缓存

在这里插入图片描述

异步容易回调地狱，这里我们使用同步
在这里插入图片描述
使用同步

在这里插入图片描述

在这里插入图片描述

小程序里查看
在这里插入图片描述

getStorage 得到缓存数据到本地 getStorageSync 同步得到缓存数据到本地

在这里插入图片描述

getStorageInfoSync打印全部的storage的key

在这里插入图片描述

在这里插入图片描述

removeStorageSync 删除某个缓存

在这里插入图片描述

clearStorageSync清除所有缓存

在这里插入图片描述

网络发起请求

在这里插入图片描述

接口测试地址

在这里插入图片描述

免费测试api接口
在这里插入图片描述

获取100条json数据测试接口
在这里插入图片描述

request方法

在这里插入图片描述

另一种写法（支持promise写法）
在这里插入图片描述
可以改成async&await 方式（ES7的语法）代码更加的清晰

request不同类型的参数

在这里插入图片描述

自定义请求头信息

在这里插入图片描述

定义请求类型，默认是 application/json
在这里插入图片描述

在这里插入图片描述

test/plain 可能会比 application/json快一些
在这里插入图片描述

响应返回的类型默认是json
在这里插入图片描述

超时时间默认一分钟
在这里插入图片描述

成功失败回调函数
在这里插入图片描述

无论成功与否都会调用complete（完成）函数
可以把隐藏loading放在这里
在这里插入图片描述

这里可以模拟慢网络，测试是否超时进入fail函数
在这里插入图片描述

在这里插入图片描述

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。