uni-app点击按钮弹出提示框(以弹窗的形式显示),选择确定和取消

news2024/11/28 16:44:28

学习目标:

学习目标如下所示:

  • uni-app点击提交按钮后弹出提示框,(以弹窗的形式显示),提示用户是否确认提交(即确定和取消),点击确定后调用真正的提交方法,将数据传给后端,点击取消后,模态框自动消失,不请求后端接口。

学习内容:

内容如下所示:

  1. 显示用户需要确认的模态框
    点击提交按钮,弹窗的显示
<view style="display: flex; justify-content: space-around;">
	  <button class="button" @click="submit">t提交</button>
</view>
  1. 调用的方法
submit(){
			let that=this
			uni.showModal({
					title: '提示:',
					content: '请确认是否要提交?',
					success: function(res) {
						if (res.confirm) {
							// console.log('确定');
					     	//TODO
						} else if (res.cancel) {
							// console.log('取消');
							//TODO
						}
					}
			});
		},

总结:

知识小结:

  • 模态框的主要内容
uni.showModal({
   title: '提示',
   content: '请确认是否要提交?',
   success: function (res) {
       if (res.confirm) {
           console.log('用户点击确定');
       } else if (res.cancel) {
           console.log('用户点击取消');
       }
   }
});
  • 2、注意:
    uni.showModal方法的提示框大小是固定的,无法通过设置字体大小来改变提示框中的文字大小。如果我们想要控制文字大小,可以通过CSS样式的方式来实现。 即通过 font-size: 16px; 控制字体的大小。
  • 3、示例效果如下所示:
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/793269.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

进程虚拟地址空间区域划分

目录 图示 详解 代码段 备注&#xff1a;x86 32位linux环境下&#xff0c;进程虚拟地址空间区域划分 图示 详解 用户空间 用于存储用户进程代码和数据&#xff0c;只能由用户进程访问 内核空间 用于存储操作系统内核代码和数据&#xff0c;只能由操作系统内核访问 text t…

SpringBoot实战(二十三)集成 SkyWalking

目录 一、简介二、拉取镜像并部署1.拉取镜像2.运行skywalking-oap容器3.运行skywalking-ui容器4.访问页面 三、下载解压 agent1.下载2.解压 四、创建 skywalking-demo 项目1.Maven依赖2.application.yml3.DemoController.java 五、构建启动脚本1.startup.bat2.执行启动脚本3.发…

攻防世界-Reverse-re1

题目描述&#xff1a;菜鸡开始学习逆向工程&#xff0c;首先是最简单的题目 下载附件&#xff0c;执行程序&#xff0c;如下界面 1. 思路分析 没啥说的&#xff0c;既然题目都说是一道简单的逆向题&#xff0c;那么直接使用ida逆向即可&#xff0c;看逆向出的结果是否能写入到…

Cesium态势标绘专题-矩形(标绘+编辑)

标绘专题介绍:态势标绘专题介绍_总要学点什么的博客-CSDN博客 入口文件:Cesium态势标绘专题-入口_总要学点什么的博客-CSDN博客 辅助文件:Cesium态势标绘专题-辅助文件_总要学点什么的博客-CSDN博客 本专题没有废话,只有代码,代码中涉及到的引入文件方法,从上面三个链…

tensorRT多batch动态推理

tensorRT的多batch推理&#xff0c;导出的onnx模型必须是动态batch&#xff0c;只需在导出的时候&#xff0c;设置一个dynamic_axis参数即可。 torch.onnx.export(hybrik_model, dummy_input, "./best_model.onnx", verboseTrue, input_namesinput_names, \output_…

【Vue3基础】组合事件配合v-model、watch的使用

一、需求描述 在组合事件中&#xff0c;实现在子事件输入框中输入使父事件实时显示输入内容 二、代码参考 1、关注文件&#xff0c;在App中嵌套Main&#xff0c;在Main中嵌套searchDemo 2、Main.vue文件 <template><h3>Main页面</h3><p>搜索内容为…

2023河南萌新联赛第(三)场:郑州大学(两个题目)

1.入门mex 重点 一些数字的mex是从0往上枚举&#xff0c;第一个没出现的数字。请你回答选最多k个数字&#xff0c;mex最大是多少 既然从0开始枚举&#xff0c;那么应该是最小&#xff0c;那么最大是什么&#xff1f; 经过自己的考虑&#xff0c;给出一个样例&#xff0c;0 1 1…

基于论文摘要的文本分类与关键词抽取(一)

基于论文摘要的文本分类与关键词抽取&#xff08;一&#xff09; 赛题介绍Baseline思路安装库并导入数据集下载并处理选择模型并训练提交结果 赛题介绍 基于论文摘要的文本分类与关键词抽取挑战赛 本任务分为两个子任务&#xff1a; 1.机器通过对论文摘要等信息的理解&#x…

empty module导致的lvs问题

write_verilog时-exclude empty_modules即可 这里也分享一下ICC2 write lvs netlist的命令 write_verilog -exclude {scalar_wire_declarations leaf_module_declarations empty_modules well_tap_cells filler_cells supply_statements} -hierarchy all -force_no_referenc…

电商小程序 留住用户秘诀

你是否也收到这样的用户反馈&#xff1f; 商品列表滚动区域太小&#xff0c;很难找到想要的商品。头部的搜索广告占据了半个屏幕&#xff0c;挤占了实际空间。在我手机这样小的屏幕上&#xff0c;展示区域太小了&#xff0c;能否把它放大点&#xff1f; 在电商页面中&#xff…

Web3将自己写在合约中的代币添加到MetaMask中管理

上文 Web3带着大家根据ERC-20文档编写自己的第一个代币solidity智能合约 带着大家在智能合约中创建了一个自己的代币系统 我们可以在MetaMask中去导入 ganache环境下模拟出来的第一和第二个账号 我们这里 可以看到他们的 ETH 但看不到自己的代币符号 没关系 我们点击这下面的…

linux 内核总结

注意&#xff1a;队列只是一格以前的称呼&#xff0c;底层是链表 进程 多个cpu&#xff0c;每个cpu都有自己的进程队列 进程分类&#xff1a; 实时进程 与用户交互的进程&#xff0c;需要及时的响应&#xff08;优先级 0~100&#xff09; 普通进程 响应不需要那么及时的…

Ubuntu的安装与部分配置

该教程使用的虚拟机是virtuabox&#xff0c;镜像源的版本是ubuntu20.04.5桌面版 可通过下面的链接在Ubuntu官网下载&#xff1a;Alternative downloads | Ubuntu 也可直接通过下面的链接进入百度网盘下载【有Ubuntu20.04.5与hadoop3.3.2以及jdk1.8.0_162&#xff0c;该篇需要使…

openlayers点线面绘制工具栏

效果大概如上&#xff0c;点击了按钮之后在地图上绘制相对应的点/线/面。 代码部分&#xff1a; 首先放个容器 <div id"toolbar"></div> js部分&#xff08;因为地图已经创建好了&#xff0c;我这里就不放地图的代码了&#xff0c;如果需要可以看我上…

《Docker调试技巧与工具:解决常见容器问题,助力容器应用稳定运行》

&#x1f337;&#x1f341; 博主 libin9iOak带您 Go to New World.✨&#x1f341; &#x1f984; 个人主页——libin9iOak的博客&#x1f390; &#x1f433; 《面试题大全》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33…

Leetcode 滑动窗口题目总结

(Leetcode 滑动窗口题目总结) 1&#xff1a; 3.无重复字符的最长子串 https://leetcode.cn/problems/longest-substring-without-repeating-characters/description/子串 和 子序列的区别&#xff1a;字串是连续的&#xff0c;子序列是非连续的。快慢指针 i 和 j&#xff0c;…

登录页的具体实现 (小兔鲜儿)【Vue3】

登录页 整体认识和路由配置 整体认识 登录页面的主要功能就是表单校验和登录登出业务 准备模板 <script setup></script><template><div><header class"login-header"><div class"container m-top-20"><h1 cl…

【外卖系统】员工信息分页查询

需求分析 当数据较多时&#xff0c;如果将数据在一个页面中全部展示出来会显得比较乱&#xff0c;不便于查看&#xff0c;所以一般系统都会以分页的方式来展示列表数据。 代码开发 页面发送ajax请求&#xff0c;将分页查询参数&#xff08;page、pageSize、name&#xff09;…

精密空调监控太难?手动太慢?这才是最牛的工具!

在医疗设施中&#xff0c;精密空调监控是一项至关重要的系统。它扮演着保障患者健康和医疗操作顺利进行的关键角色。 精密空调系统能够确保手术室、实验室和重症监护室等关键区域内的恒温、湿度和空气质量处于合适状态&#xff0c;从而保证医疗设备的正常运行和医护人员的舒适工…

【考研前阳了】成电858上岸学长经验分享

这个系列会邀请往届学长学姐进行经验分享~欢迎后台回复经验分享&#xff0c;进行投稿&#xff01; 经验贴征集&#xff1a;前人栽树&#xff0c;后人乘凉&#xff0c;上岸同学也是看着经验贴一点一点过来的&#xff0c;有偿征集各位同学的经验分享&#xff0c;以此来帮助更多的…