【uni-app学习手札】
uni-app(vue3)编写微信小程序
编写uni-app不必拘泥于HBuilder-X编辑器,可用vscode进行编写,在《微信开发者工具》中进行热加载预览,
主要记录使用uni-app过程中自我备忘一些api跟语法,方便以后编写查找使用,uni结合了很多微信小程序与vue语法
文章目录
- uni-app(vue3)编写微信小程序
- @[TOC](文章目录)
- 一、项目准备
- 1.1 运行步骤
- 二、api备忘
- 2.1 显示消息提示框(uni.showToast)
- 2.2 显示 loading 提示框( uni.hideLoading )
- 2.3 显示模态弹窗( uni.showModal)
- 2.4 从底部向上弹出操作菜单( uni.showActionSheet)
文章目录
- uni-app(vue3)编写微信小程序
- @[TOC](文章目录)
- 一、项目准备
- 1.1 运行步骤
- 二、api备忘
- 2.1 显示消息提示框(uni.showToast)
- 2.2 显示 loading 提示框( uni.hideLoading )
- 2.3 显示模态弹窗( uni.showModal)
- 2.4 从底部向上弹出操作菜单( uni.showActionSheet)
一、项目准备
1.1 运行步骤
-
新建项目
新建项目步骤之前写过,可参考地址:uniapp使用 -
引入插件
若新增项目的时候直接引用uni-ui项目,会直接内置uni-app的UI组件,组件的文档地址:uni组件介绍地址 -
安装依赖
若使用uni官方自带的编辑器HBuilder X是不需要的安装你的环境以及项目所需以来的,由于uni-app主要使用的vue语法,在前端vscode编辑器中编写更加习惯,所以需要安装一下依赖,安装依赖的命令行与常规vue项目目无异,直接:npm install 即可 -
热加载预览运行
若使用HBuilder X编辑器在运行在内置浏览器编写的样式或者api语法,有时可能会出现报错情况,所以对于写微信小程序来说,最好预览运行界面在《微信开发者工具》中,
npm run dev:mp-weixin
运行后在项目文件中出现的文件夹dist文件中,dev文件夹下的mp-weixin文件,在《微信开发者工具》中进行导入该文件即可,后续在编辑器中进行编码,微信开发者工具会进行同步加载更新,
- 打包部署
开发的时候,使用的dev下的文件夹导入,当部署微信的时候还是需要在《微信开发者工具》中进行上传,uni-app提供了压缩版本,用于微信上传操作的打包部署,执行步骤基本与运行相同,不用于热更新运行,只用于上传,类似于vue常规项项目运行 run dev,打包run build,再部署dist文件,打包命令:
npm run build:mp-weixin
二、api备忘
2.1 显示消息提示框(uni.showToast)
官网地址:消息提示框
api示例
uni.showToast({title: '标题',duration: 2000,})
关闭api
uni.hideToast()
2.2 显示 loading 提示框( uni.hideLoading )
官网地址:loading 提示框
api示例
uni.showLoading({mask: true,title: '加载中',})
关闭 loading的api
uni.hideLoading()
2.3 显示模态弹窗( uni.showModal)
官网地址:显示模态弹窗
api示例
uni.showModal({title: '提示',content: '这是一个模态弹窗',success: function (res) {if (res.confirm) {console.log('用户点击确定');} else if (res.cancel) {console.log('用户点击取消');}}
});
2.4 从底部向上弹出操作菜单( uni.showActionSheet)
官网地址:从底部向上弹出操作菜单
api示例
uni.showActionSheet({itemList: ['A', 'B', 'C'],success: function (res) {console.log('选中了第' + (res.tapIndex + 1) + '个按钮');},fail: function (res) {console.log(res.errMsg);}
});
相关文章:
【uni-app学习手札】
uni-app(vue3)编写微信小程序 编写uni-app不必拘泥于HBuilder-X编辑器,可用vscode进行编写,在《微信开发者工具》中进行热加载预览, 主要记录使用uni-app过程中自我备忘一些api跟语法,方便以后编写查找使用…...
ASP.NET Core 中使用 Dapper 的 Oracle 存储过程输出参数
介绍 Oracle 数据库功能强大,在企业环境中使用广泛。在 ASP.NET Core 应用程序中使用 Oracle 存储过程时,处理输出参数可能具有挑战性。本教程将指导您完成使用 Dapper(适用于 . NET 的轻量级 ORM(对象关系映射器)&am…...
C++的动态内存分配
使用new/delete操作符在堆中分配/释放内存 //使用new操作符在堆中分配内存int* p1 new int;*p1 2234;qDebug() << "数字是:" << *p1;//使用delete操作符在堆中释放内存delete p1;在分配内存的同时初始化 //在分配内存的时初始化int* p2 n…...
【论文阅读】-- TSR-TVD:时变数据分析和可视化的时间超分辨率
TSR-TVD: Temporal Super-Resolution for Time-Varying Data Analysis and Visualization 摘要1 引言2 相关工作3 我们的循环生成方法3.1 损失函数3.2 网络架构 4 结果与讨论4.1 数据集和网络训练4.2 结果4.3 讨论 5 结论和未来工作致谢参考文献附录1 训练算法及优化2 网络分析…...
《web应用技术》第12次课后作业
1、了解servlet技术 Servlet(server applet):运行在服务器的小程序,Servlet就是一个接口,定义了Java类被浏览器访问到的规则。将来我们自定义一个类,实现Servlet接口,复写方法。 Servlet本身不能独立运行,…...
【初阶数据结构】深入解析带头双向循环链表:探索底层逻辑
🔥引言 本篇将介绍带头双向循环链表底层实现以及在实现中需要注意的事项,帮助各位在使用过程中根据底层实现考虑到效率上问题和使用时可能会导致的错误使用 🌈个人主页:是店小二呀 🌈C语言笔记专栏:C语言笔…...
【面试干货】Java中的访问修饰符与访问级别
【面试干货】Java中的访问修饰符与访问级别 1、public2、protected3、默认(没有访问修饰符)4、private 💖The Begin💖点点关注,收藏不迷路💖 在Java中,访问修饰符用于控制类、变量、方法和构造器…...
Oracle最终还是杀死了MySQL
起因 大约15年前,Oracle收购了Sun公司,从而也拥有了MySQL,互联网上关于Oracle何时会“扼杀MySQL”的讨论此起彼伏。 当时流传着各种理论:从彻底扼杀 MySQL 以减少对 Oracle 专有数据库的竞争,到干掉 MySQL 开源项目&…...
【Python的随机数汇总】
我们写python代码的时候,很少能用得上随机数,但是随机数有很多妙用。例如,在我们做测试数据集的时候,可以构建一个随机的dataframe; 或者在保存数据的时候,可以在每条数据前插入一列作为,不重…...
[状态压缩 广搜BFS]Saving Tang Monk
描述 《Journey to the West》(also 《Monkey》) is one of the Four Great Classical Novels of Chinese literature. It was written by Wu Chengen during the Ming Dynasty. In this novel, Monkey King Sun Wukong, pig Zhu Bajie and Sha Wujing, escorted Tang Monk to…...
Flutter 实现软鼠标
文章目录 前言一、如何实现?1、记录鼠标偏移2、MouseRegion获取偏移3、Transform移动图标 二、完整代码三、使用示例总结 前言 flutter在嵌入式系统中运行时,有可能遇到drm鼠标无法使用的情况,但鼠标事件却可以正常接收,此时如果…...
使用 MLRun 和 MinIO 设置开发机器
MLOps 之于机器学习,就像 DevOps 之于传统软件开发一样。两者都是一组旨在改善工程团队(开发或 ML)和 IT 运营 (Ops) 团队之间协作的实践和原则。目标是使用自动化来简化开发生命周期,从规划和开发到部署和…...
资质申请表详解:填写《建筑幕墙工程设计专项资质申请表》的要点
填写《建筑幕墙工程设计专项资质申请表》的要点如下,按照清晰、分点表示和归纳的方式整理,并参考了文章中的相关数字和信息: 一、封面 申报企业名称:按照工商营业执照内容填写全称,并加盖企业公章。填报日期…...
华为手机怎么找回删除的照片?掌握3个方法,恢复不是梦
由于误删、设备故障、软件更新等原因,我们有时可能会不慎丢失这些宝贵的照片。当面对空空如也的相册时,那种失落感无法言喻。华为手机该怎么找回删除的照片呢?但是,请不要绝望!在科技的帮助下,我们可以采取…...
数据结构试题 20-21
真需要就死记吧 二叉树遍历-先序(非递归)【图解代码】_哔哩哔哩_bilibili 解释一下步骤: 一个循环为: 1.取节点 2.放右子树 3.放左子树 每次循环,都要从栈里取出一个节点 先放右子树,再放左子树 那这道题就是,先放1&am…...
vscode插件开发之 - TestController
TesController概要介绍 TestController 组件是用于实现自定义测试框架和集成测试结果的。它允许开发者定义自己的测试运行器,以支持在VSCode中运行和展示测试。以下是一些使用 TestController 组件的主要场景: 自定义测试框架:如果你正在开发…...
QBitArray使用详解
QBitArray使用详解 一、创建和初始化 QBitArray1.1 QBitArray默认构造1.2 QBitArray指定大小的构造1.3 QBitArray指定大小和初始值的构造 二、设置和访问位2.1 QBitArray设置单个位2.2 QBitArray访问单个位2.3 QBitArray使用下标操作符 三、设置所有位3.1 QBitArray将所有位设置…...
基于Python的自然语言处理项目 ChatTTS 推荐
**项目名称:ChatTTS** ChatTTS是一个基于Python的自然语言处理项目,旨在实现一个简单的文本到语音转换系统。它使用深度学习技术,通过自然语言处理和语音合成算法,将文本转换为语音输出。 **项目介绍**: Chat…...
论 To B 产品:从概念到市场实践
本文作者为 360 奇舞团产品经理 论 To B 产品:从概念到市场实践 To B 产品在商业世界中扮演着至关重要的角色。相较于面向消费者的To C市场,To B市场更专注于为其他企业提供产品和服务。理解和成功运营To B产品需要对其特定的市场需求和运作方式有深刻的…...
如何通过自定义模块DIY出专属个性化的CSDN主页?一招教你搞定!
个人主页:学习前端的小z 个人专栏:HTML5和CSS3悦读 本专栏旨在分享记录每日学习的前端知识和学习笔记的归纳总结,欢迎大家在评论区交流讨论! 文章目录 💯如何通过HTMLCSS自定义模板diy出自己的个性化csdn主页&#x…...
[BSidesCF 2020]Had a bad day1
看到页面有两个按钮 先随便点一个试一下,当我们点击之后发现url是有变动的 感觉url是有点东西的,可能是某种注入,先尝试一下sql注入,发现给出了报错 通过报错我们可以确定是文件包含漏洞,那我们试试php伪协议去读取一下…...
从媒体网站的频道划分看媒体邀约的分类?
传媒如春雨,润物细无声,大家好,我是51媒体网胡老师。 媒体宣传加速季,100万补贴享不停,一手媒体资源,全国100城线下落地执行。详情请联系胡老师。 在我们举行活动的时候,通常会邀请媒体到现场来…...
Day40
Day40 监听器 概念: 监听器用于监听web应用中某些对象信息的创建、销毁、增加,修改,删除等动作的 发生,然后作出相应的响应处理。当范围对象的状态发生变化的时候,服务器自动调用 监听器对象中的方法。 常用于统计在线…...
linux基础 - 内核的基础概念
目录 零. 前言 一. 源码简介 二. 存储管理 物理内存管理: 虚拟内存管理: 内存分配与回收: 三. CPU 和进程管理 进程管理: CPU 管理: 四. 文件系统 文件系统的概念 常见的 Linux 文件系统类型 文件系统的工…...
centos7系统使用docker-compose安装部署jenkins
CentOS7系统使用docker-compose安装部署jenkins,并实现前后端自动构建 记录一次工作中部署jenkins的真实经历,总结了相关经验 1.准备环境 1.java 由于最新的jenkins需要jdk11以上才能支持,而系统里的jdk是1.8的,因此等jenkins安…...
传染病报卡内容——丙型
--丙型 select a.morbiditdate 发病日期, diagnosedate 诊断日期, a.deathdate 死亡日期, a.casetypequality 病例分类,a.hcvrna "HCR_RNA定量" from zl_sdmb.t_报卡记录 t, c1_infectiousv1_6 a where t.id a.fileid and t.卡片种类 传…...
本地快速部署大语言模型开发平台Dify并实现远程访问保姆级教程
文章目录 前言1. Docker部署Dify2. 本地访问Dify3. Ubuntu安装Cpolar4. 配置公网地址5. 远程访问6. 固定Cpolar公网地址7. 固定地址访问 前言 本文主要介绍如何在Linux Ubuntu系统使用Docker快速部署大语言模型应用开发平台Dify,并结合cpolar内网穿透工具实现公网环境远程访问…...
《Cloud Native Data Center Networking》(云原生数据中心网络设计)读书笔记 -- 02 Clos拓扑
本章回答以下问题: 什么是 Clos 拓扑,它与“接入 - 汇聚 - 核心”拓扑有何不同?Clos 拓扑的特征是什么?Clos 拓扑对数据中心网络的影响是什么? Clos拓扑 云原生数据中心基础设施的先行者们想要构建一种支持大规模水平扩展网络。 基本的Clos拓扑如图…...
VUE3版本新特性
VUE3版本新特性 VUE3和VUE2的区别路由的使用vite安装项目新特性使用 1.VUE3和VUE2的区别 2020年9月18日,Vue.js发布版3.0版本,代号:One Piece 于 2022 年 2 月 7 日星期一成为新的默认版本! Vue3性能更高,初次渲染快55%, 更新渲染快133% 。…...
【Oracle篇】Oracle数据库坏块处理:rman修复坏块实践与案例分析(第七篇,总共八篇)
💫《博主介绍》:✨又是一天没白过,我是奈斯,DBA一名✨ 💫《擅长领域》:✌️擅长Oracle、MySQL、SQLserver、阿里云AnalyticDB for MySQL(分布式数据仓库)、Linux,也在扩展大数据方向的知识面✌️…...
一级A视网站 一级做爰片/云南最新消息
1.基本介绍 原则是尽量使用合成/聚合的方式,而不是使用继承合成复用原则又叫做合成/聚合原则。该原则是在一个新的对象里面使用一些已有的对象, 使之成为新对象的一部分,新的对象通过向这些对象的委派达到复用已有功能的目的 2. 合成与聚合…...
山东做网站公司哪家好/临沂google推广
文章目录10.1 Java与线程10.1.1 线程的实现1. 使用内核线程实现2. 使用用户线程实现3. 混合实现4.Java线程的实现10.1.2 Java线程调度10.1.3 状态转换10.1 Java与线程 10.1.1 线程的实现 线程的引入,可以把一个进程的资源分配和执行调度分开,各个线程既…...
万网主机建设网站流程/攀枝花seo
问题: 1、如何仅用队列结构实现栈结构? 2、如何仅用栈结构实现队列结构? 实现思路: 1、使用两个队列结构Queue1和Queue2 ,push操作一样,添加push()到Queue1,pop()核心是把 Queue1 除最后添加的元素"剪切"…...
平度市城乡建设局网站/网络搭建的基本流程
手机 WPS 最大显示条数,建议是还是在电脑使用较高版本打开表格 更文件保存后缀...
经营性网站备案 上海/seo推广优化平台
使用Spreadsheet_Excel_Reader类,同时中文方面的问题是方法如下(Spreadsheet_Excel_Reader自带的例子,稍作修改): <?php require_once Excel/reader.php; $data new Spreadsheet_Excel_Reader(); $data->setOu…...
闵行虹桥网站建设/seo优化培训多少钱
现在有一个需求就是在发版的时候希望除公司IP外的外网访问服务的时候都是拒绝访问的 现在利用haproxy 的acl规则作出限制 errorfile 403 /etc/haproxy/errfile/403.httpacl url_bao hdr(Host) …...