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

学习目标:

学习目标如下所示:

  • 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、示例效果如下所示:
    在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【基于矢量射线的衍射积分 (VRBDI)】基于矢量射线的衍射积分 (VRBDI) 和仿真工具(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

文心一言大数据模型-文心千帆大模型平台

官网&#xff1a; 文心千帆大模型平台 (baidu.com) 文心千帆大模型 (baidu.com) 模型优势 1、模型效果优&#xff1a;所需标注数据少&#xff0c;在各场景上的效果处于业界领先水平 2、生成能力强&#xff1a;拥有丰富的AI内容生成&#xff08;AIGC&#xff09;能力 3、应用…

Flink CEP(二) 运行源码解析

通过DemoApp学习一下&#xff0c;CEP的源码执行逻辑。为下一篇实现CEP动态Pattern奠定理论基础。 1. Pattern的定义 Pattern<Tuple3<String, Long, String>,?> pattern Pattern.<Tuple3<String, Long, String>>begin("begin").where(new…

详解python中的垃圾回收机制

目录 什么是垃圾回收机制 垃圾回收的工作流程 为什么要进行垃圾回收 详解python中的垃圾回收机制 总结 什么是垃圾回收机制 垃圾回收&#xff08;Garbage Collection&#xff09;是一种自动内存管理机制&#xff0c;用于检测和释放不再被程序使用的内存资源&#xff0c;以…

基于开源IM即时通讯框架MobileIMSDK:RainbowChat v9.0版已发布

关于MobileIMSDK MobileIMSDK 是一套专门为移动端开发的开源IM即时通讯框架&#xff0c;超轻量级、高度提炼&#xff0c;一套API优雅支持UDP 、TCP 、WebSocket 三种协议&#xff0c;支持iOS、Android、H5、标准Java平台&#xff0c;服务端基于Netty编写。 工程开源地址是&am…

Linux 终端生成二维码

1、安装qrencode [rootnode1 script]# yum -y install qrencode2、输出正常的 [rootnode1 ~]# echo https://www.github.com|qrencode -o - -t utf83、输出彩色的 [rootnode1 ~]# qrencode -t utf8 -s 1 https://www.github.com|lolcatPS&#xff1a;没有lolcat命令 #由于…

【计算机视觉中的 GAN 】 - 生成学习简介(1)

一、说明 在阅读本文之前&#xff0c;强烈建议先阅读预备知识&#xff0c;否则缺乏必要的推理基础。本文是相同理论GAN原理的具体化范例&#xff0c;阅读后有两个好处&#xff1a;1 巩固了已经建立的GAN基本概念 2 对具体应用的过程和套路进行常识学习&#xff0c;这种练习题一…

数据结构——单链表

不能毁灭我的&#xff0c;终将使我更强大 文章目录 一、链表 二、单链表 三、实现单链表 1.定义节点 2.由数据生成节点 3.连接并打印链表 4.单链表的基本接口 头插 头删 尾插 尾删 由数据Data找节点 在pos之前插入节点 在pos之后插入节点 删除pos节点 删除po…

Matplotlib_绘制柱状图

绘制柱状图 &#x1f9e9;bar方法 bar()是Matplotlib.pyplot库中用于绘制条形图&#xff08;bar chart&#xff09;的函数。条形图是一种常见的数据可视化图表&#xff0c;用于显示不同类别之间的比较。 函数签名&#xff1a; matplotlib.pyplot.bar(x, height, width0.8, …

【KO】vite使用 git bash here创建vue3项目时方向键失败!

文章目录 起因过程结果 起因 今天使用vite创建ue3项目&#xff0c;因为git使用习惯了就直接用git运行创建命令&#xff0c;前两步都没啥问题&#xff0c;到选择框架的时候问题来了&#xff0c;方向键无效。如图&#xff1a; 过程 常理来说是直接用方向键↑和↓进行选择&…

3d激光slam建图与定位(1)_基于ndt算法定位

一.代码实现流程 二.ndt算法原理 一.该算法定位有三个进程文件 1.map_loader.cpp用于点云地图的读取&#xff0c;从文件中读取点云后对这个点云地图进行旋转平移后发布点云地图到ros #include "map_loader.h"MapLoader::MapLoader(ros::NodeHandle &nh){std::st…

【深度学习笔记】动量梯度下降法

本专栏是网易云课堂人工智能课程《神经网络与深度学习》的学习笔记&#xff0c;视频由网易云课堂与 deeplearning.ai 联合出品&#xff0c;主讲人是吴恩达 Andrew Ng 教授。感兴趣的网友可以观看网易云课堂的视频进行深入学习&#xff0c;视频的链接如下&#xff1a; 神经网络和…

Python开发之手动实现一维线性插值

Python开发之手动实现一维线性插值 1.线性插值法介绍2.手动实现线性插值3.案例一&#xff1a;手动实现线性插值4.使用pandas的插值方法实现要求(推荐)5.案例二&#xff1a;对一组数据进行线性插值和SG滤波处理 前言&#xff1a;主要介绍手动实现一维线性插值以及pandas里面的in…

【Docker】容器的数据卷

目录 一、数据卷的概念与作用 二、数据卷的配置 三、数据卷容器的配置 一、数据卷的概念与作用 在了解什么是数据卷之前我们先来思考以下这些问题&#xff1a; 1.如果我们一个容器在使用后被删除&#xff0c;那么他里面的数据是否也会丢失呢&#xff1f;比如容器内的MySQL的…

2023年的深度学习入门指南(21) - 百川大模型

2023年的深度学习入门指南(21) - 百川大模型 前面我们用了三节的篇幅介绍了目前最强大的开源模型LLaMA2。这一节我们说一说国产大模型的一个代表&#xff0c;百川大模型。 使用百川大模型 第一步我们先把百川用起来&#xff0c;然后再研究如何训练和其原理如何。 百川的使用…

Mybatis使用collection映射一对多查询分页问题

场景&#xff1a;页面展示列表&#xff0c;需要查询多的字段&#xff0c;和一的字段。并且还要分页。 这时候直接想到的是手写sql。 /*** 标签*/private List<BasicResidentTags> tags;Data TableName("basic_resident_tags") public class BasicResidentTag…

vue3 - element-plus 上传各种 word pdf 文件、图片视频并上传到服务器功能效果,示例代码开箱即用。

效果图 在 vue3 项目中,使用 element plus 组件库的 el-upload 上传组件,进行文件、图片图像的上传功能示例。 完整代码 可直接复制,再改个接口地址。 在这里上传图片和文件是分成

新产品:Stimulsoft Forms 2023.3.1 Crack

Stimulsoft Forms 是一个用于交互式收集和处理用户数据的组件。表单工具可以轻松集成到您的项目或应用程序中&#xff0c;具有直观且用户友好的界面&#xff0c;并允许您创建丰富的表单模板。Stimulsoft Forms 是应用程序中与用户交互的新水平 什么是 Stimulsoft Forms&#xf…

华为数通HCIP-EVPN基础

MP-BGP MP-BGP&#xff08;Multiprotocol Extensions for BGP-4&#xff09;在RFC4760中被定义&#xff0c;用于实现BGP-4的扩展以允许BGP携带多种网络层协议&#xff08;例如IPv6、L3VPN、EVPN等&#xff09;。这种扩展有很好的后向兼容性&#xff0c;即一个支持MP-BGP的路由…

cad丢失mfc140u.dll怎么办?找不到mfc140u.dll的解决方法

第一&#xff1a;mfc140u.dll有什么用途&#xff1f; mfc140u.dll是Windows操作系统中的一个动态链接库文件&#xff0c;它是Microsoft Foundation Class (MFC)库的一部分。MFC是 C中的一个框架&#xff0c;用于构建Windows应用程序的用户界面和功能。mfc140u.dll包含了MFC库中…