Mint-UI组件 MessageBox为prompt 添加判断条件
这篇文章较早,参考时请优先查看官方文档API 和 源码
Mint-UI 的Message Box 是prompt类型时,可以添加正则判断或者function判断条件。具体可以查看Mint-UI源码。
添加正则判断条件:
MessageBox({
$type:'prompt',
title:'输入验证码',
message:'请填写您收到的验证码',
closeOnClickModal:false, //点击model背景层不关闭MessageBox
showCancelButton:false, //不显示取消按钮
inputPattern:/^[a-zA-Z0-9]{6}$/, //正则条件
inputErrorMessage:'请输入正确的验证码',
showInput:true
}).then(({ value, action }) => {
/* value 为填写的值,进行下一步操作*/
console.log(value);
});
添加function判断条件
MessageBox({
$type:'prompt',
title:'输入验证码',
message:'请填写您收到的验证码',
closeOnClickModal:false, //点击model背景层不关闭MessageBox
showCancelButton:false, //不显示取消按钮
inputValidator:function(v){return /^[a-zA-Z0-9]{6}$/.test(v);}, //function可以用来写更复杂的判断条件,返回布尔值
inputErrorMessage:'请输入正确的验证码',
showInput:true
}).then(({ value, action }) => {
/* value 为填写的值,进行下一步操作 */
console.log(value);
});
Mint-UI组件 MessageBox为prompt 添加判断条件的更多相关文章
- MYSQL如何在创建表时添加判断条件
大家好,我是小皓. 一.背景 今天在博主练习MYS创建表操作时遇到一个语法报错,就想着来和大家分享一下MYSQL如何在创建表时添加判断条件: ERROR 1064 (42000): You have ...
- 16款优秀的Vue UI组件库推荐
16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基 ...
- [转载]前端——实用UI组件库
https://www.cnblogs.com/xuepei/p/7920888.html Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https:/ ...
- 强烈推荐优秀的Vue UI组件库
Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基于Vue的UI组件框架开发,并投入正 ...
- Vue UI组件库
1. iView UI组件库 iView官网:https://www.iviewui.com/ 2.Vux UI组件库 Vux官网:https://vux.li/ 3.Element UI组件库 ...
- ui组件库
基于Vue的Quasar Framework 中文网 http://www.quasarchs.com/ quasarframework/quasar: Quasar Frameworkhttps:/ ...
- 【转】优秀的Vue UI组件库
原文来源:https://www.leixuesong.com/3342 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司 ...
- 第27讲 UI组件之 ScrollView与底部动态添加数据
第27讲 UI组件之 ScrollView与底部动态添加数据 1. ScrollView(滚动视图) ScrollView(滚动视图)是实现滚动的一个控件,只需要将需要滚动的控件添加到ScrollVi ...
- Vue移动组件库Mint UI的安装与使用
一.什么是 Mint UI 1.Mint UI 包含丰富的 CSS 和 JS 组件,可以提升移动端开发效率 2.Mint UI 按需加载组件 3.Mint UI 轻量化 二.Mint UI 的安装 1 ...
随机推荐
- RAC(ReactiveCocoa)概括
ReactiveCocoa(简称RAC,以下都用RAC)是github团队开源的一套基于Cocoa并且具有FRP(Functional Reactive Programming-响应式编程)特性的框架 ...
- DSAPI WIN7磨砂+窗体投影组合
你可以使用DSAPI和DS控件库组合多种特效,以下是透明窗体+WIN7磨砂+窗体投影组合效果 设计界面 编写代码 Private Sub Form1_Load(sender As Object, e ...
- 【转】解决未能加载文件或程序集'WebGrease‘的问题
在多个视图中,如果有使用共用的样式代码,可以把它们移至CSS文件中去.今天Insus.NET就举例一个例子来说明. 比如前2篇中<ASP.NET MVC图片管理(上传,预览与显示)>htt ...
- .net core jwt 入门记录
从百度里搜索里搜索了很多jwt的文章,跟着文章写了一个demo,这里记录下学习过程中碰上的问题.看文章多遍,不如手工实现一次. 模板已上传到github.com:dogvane/webapi_jwt_ ...
- 利用data-src属性 更换图片
<div class="img_src"> <img src="./images/luo.png"></div> <u ...
- 碰到了通过Movie显示gif图片,有部分图片的duration为0导致gif只显示第一帧
解决办法,改为使用android-gif-drawable.jar来显示gif图片(需要配合com.android.support:support-v4:18.0.0使用) GifImageView ...
- QT通过url下载图片到本地
/* strUrl:下载图片时需要的url strFilePath:下载图片的位置(/home/XXX/YYY.png) */ void ThorPromote::downloadFileFromUr ...
- Puppeteer学习之小试牛刀
最近有了写文章的动力了,一方面是受到了很多前辈们的启示,另一方面也是为了记录下来更好地学以致用.闲言少叙,先说说Puppeteer是什么. Puppeteer是一个node库,提供了一些用来操作Chr ...
- 【RL-TCPnet网络教程】第2章 嵌入式网络协议栈基础知识
第2章 嵌入式网络协议栈基础知识 本章教程为大家介绍嵌入式网络协议栈基础知识,本章先让大家有一个全面的认识,后面章节中会为大家逐一讲解用到的协议. 基础知识整理自百度百科,wiki百科等 ...
- Git源代码管理
一. 分支管理 使用 git 进行源代码管理,一般将某个项目的所有分支分为以下几条主线 1. Master 顾名思义,既然名字叫 Master ,那么该分支就是主分支的意思. master 分支永远是 ...