学习Uni-app开发小程序Day27

2024-05-27 17:36
文章标签 学习 程序 app 开发 uni day27

本文主要是介绍学习Uni-app开发小程序Day27,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

这一章学习了几个功能点,例如:try{}catch处理同步请求下载记录异常处理、onShareAppMessage分享好友和分享微信朋友圈、对分享页面传参进行特殊处理、共用分类列表页面实现我的下载和评分页面、使用mp-html富文本插件渲染公告详情页面

try{}catch处理同步请求下载记录异常处理

这是当出现异常的时候,进行catch,在catch中进行页面上的其他操作,这里就把当前的代码全部粘贴出来

	try {uni.showLoading({title: "加载中...",mask: true})let {classid,_id: wallId} = classInfo.value;let res = await apiDownloadWall({classid,wallId})if (res.errCode != 0) throw res;uni.getImageInfo({src: classInfo.value.picurl,success: (res) => {uni.saveImageToPhotosAlbum({filePath: res.path,success: (res) => {},fail: (err) => {if (err.errMsg == 'saveImageToPhotosAlbum:fail cancel') {uni.showToast({title: '保存失败,请重新点击下载',icon: "none"})return;}uni.showModal({title: '提示',content: '需要保存到手机相册授权',// showCancel: false,// cancelText: '',// confirmText: '',success: res => {if (res.confirm) {console.log("确认授权了");uni.openSetting({success: (setting) => {if (setting.authSetting[scope.writePhotosAlbum]) {uni.showToast({title: "获取授权成功",icon: 'none'})} else {uni.showToast({title: "获取授权失败",icon: 'none'})}}})}},fail: () => {},complete: () => {}});},complete: () => {uni.hideLoading()}})}})} catch (err) {uni.hideLoading();}

这里就是当代码出现错误的时候,页面上的loading是没有关闭的,那就放在catch中进行关闭

onShareAppMessage分享好友和分享微信朋友圈并传递参数

这里是使用自带的功能进行分享给好友和分享到朋友圈的,
分享给好友:onShareAppMessage,这里使用这个属性后,需要再页面上引用的,例如:在这里插入图片描述
这是使用的不用带参数的情况,还有一种是需要传递参数的,这个就和页面跳转一样,只要在path后面用?&进行添加字段就好,接收的时候,也是在onLoad中接收使用的

分享到朋友圈:onShareTimeline,使用这个必须要前面的onShareAppMessage进行了设置,不然不能使用,还有就是需要再开发者平台上,进行微信认证,不然也是不能使用的,我这边没有认证,只能是给出代码,没有实验效果
在这里插入图片描述
这里需要注意的一点是,分享到朋友圈这个功能,传参是不能按照前面的方式的,在微信开发者文档中,有详细说明,在uni-app文档中,只是简单说了下,不详细
在这里插入图片描述
onShareTimeline传递参数的时候,是使用的query,只用写path后面的,例如:?id=1&name=user;

共用分类列表页面实现我的下载和评分页面

这是将我的下载和评分进入的页面,都是在图片分类的列表中,
在这里插入图片描述
在页面上点击跳转,传递参数过去,但是,在分类页面上,本身也有需要的参数,这里会不会出现参数混乱的问题?不用的担心,在接收的时候,有特定的参数type,在分类页面上,是用onLaod接收参数,
在这里插入图片描述
加个判断,有值的时候,就赋值。因为展示的页面数据不同,所以访问的接口也不同,用同样的方式,可以是两个访问接口,例如:
在这里插入图片描述
设定同一个名称,然后进行判断,那个有值就访问那个接口,

使用mp-html富文本插件渲染公告详情页面

这是首页的公告列表点击后,进入到公告详情,这里进入页面后获取数据,然后把数据展示出来,标题、时间、作者等,但是具体的内容不能这么展示,文字内容会有各种内容,例如有htem、image、表格等,所以可以使用组件rich-text富文本展示,这是uni-app官方的富文本,但是不能放大图片等,所以使用插件市场上的mp-html,这个插件使用的办法就不多说了,直接在插件市场上搜索富文本就能找到,记住:使用插件需要重新运行。 <mp-html :content="detail.content"></mp-html> 这就是使用方法

今天的内容就算完了,都是小功能点,只要记录下重要的!!!

这篇关于学习Uni-app开发小程序Day27的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1008139

相关文章

Android 悬浮窗开发示例((动态权限请求 | 前台服务和通知 | 悬浮窗创建 )

《Android悬浮窗开发示例((动态权限请求|前台服务和通知|悬浮窗创建)》本文介绍了Android悬浮窗的实现效果,包括动态权限请求、前台服务和通知的使用,悬浮窗权限需要动态申请并引导... 目录一、悬浮窗 动态权限请求1、动态请求权限2、悬浮窗权限说明3、检查动态权限4、申请动态权限5、权限设置完毕后

Java深度学习库DJL实现Python的NumPy方式

《Java深度学习库DJL实现Python的NumPy方式》本文介绍了DJL库的背景和基本功能,包括NDArray的创建、数学运算、数据获取和设置等,同时,还展示了如何使用NDArray进行数据预处理... 目录1 NDArray 的背景介绍1.1 架构2 JavaDJL使用2.1 安装DJL2.2 基本操

在不同系统间迁移Python程序的方法与教程

《在不同系统间迁移Python程序的方法与教程》本文介绍了几种将Windows上编写的Python程序迁移到Linux服务器上的方法,包括使用虚拟环境和依赖冻结、容器化技术(如Docker)、使用An... 目录使用虚拟环境和依赖冻结1. 创建虚拟环境2. 冻结依赖使用容器化技术(如 docker)1. 创

基于Python开发PPTX压缩工具

《基于Python开发PPTX压缩工具》在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,不便于传输和存储,所以本文将使用Python开发一个PPTX压缩工具,需要的可以了解下... 目录引言全部代码环境准备代码结构代码实现运行结果引言在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,

使用DeepSeek API 结合VSCode提升开发效率

《使用DeepSeekAPI结合VSCode提升开发效率》:本文主要介绍DeepSeekAPI与VisualStudioCode(VSCode)结合使用,以提升软件开发效率,具有一定的参考价值... 目录引言准备工作安装必要的 VSCode 扩展配置 DeepSeek API1. 创建 API 请求文件2.

基于Python开发电脑定时关机工具

《基于Python开发电脑定时关机工具》这篇文章主要为大家详细介绍了如何基于Python开发一个电脑定时关机工具,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1. 简介2. 运行效果3. 相关源码1. 简介这个程序就像一个“忠实的管家”,帮你按时关掉电脑,而且全程不需要你多做

Java中的Opencv简介与开发环境部署方法

《Java中的Opencv简介与开发环境部署方法》OpenCV是一个开源的计算机视觉和图像处理库,提供了丰富的图像处理算法和工具,它支持多种图像处理和计算机视觉算法,可以用于物体识别与跟踪、图像分割与... 目录1.Opencv简介Opencv的应用2.Java使用OpenCV进行图像操作opencv安装j

macOS怎么轻松更换App图标? Mac电脑图标更换指南

《macOS怎么轻松更换App图标?Mac电脑图标更换指南》想要给你的Mac电脑按照自己的喜好来更换App图标?其实非常简单,只需要两步就能搞定,下面我来详细讲解一下... 虽然 MACOS 的个性化定制选项已经「缩水」,不如早期版本那么丰富,www.chinasem.cn但我们仍然可以按照自己的喜好来更换

基于Qt开发一个简单的OFD阅读器

《基于Qt开发一个简单的OFD阅读器》这篇文章主要为大家详细介绍了如何使用Qt框架开发一个功能强大且性能优异的OFD阅读器,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 目录摘要引言一、OFD文件格式解析二、文档结构解析三、页面渲染四、用户交互五、性能优化六、示例代码七、未来发展方向八、结论摘要

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用