这篇文章较早,参考时请优先查看官方文档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 添加判断条件的更多相关文章

  1. MYSQL如何在创建表时添加判断条件

    大家好,我是小皓. 一.背景 今天在博主练习MYS创建表操作时遇到一个语法报错,就想着来和大家分享一下MYSQL如何在创建表时添加判断条件: ERROR 1064 (42000): You have ...

  2. 16款优秀的Vue UI组件库推荐

    16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基 ...

  3. [转载]前端——实用UI组件库

    https://www.cnblogs.com/xuepei/p/7920888.html Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https:/ ...

  4. 强烈推荐优秀的Vue UI组件库

    Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基于Vue的UI组件框架开发,并投入正 ...

  5. Vue UI组件库

    1. iView UI组件库  iView官网:https://www.iviewui.com/ 2.Vux UI组件库   Vux官网:https://vux.li/ 3.Element UI组件库 ...

  6. ui组件库

    基于Vue的Quasar Framework 中文网 http://www.quasarchs.com/ quasarframework/quasar: Quasar Frameworkhttps:/ ...

  7. 【转】优秀的Vue UI组件库

    原文来源:https://www.leixuesong.com/3342 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司 ...

  8. 第27讲 UI组件之 ScrollView与底部动态添加数据

    第27讲 UI组件之 ScrollView与底部动态添加数据 1. ScrollView(滚动视图) ScrollView(滚动视图)是实现滚动的一个控件,只需要将需要滚动的控件添加到ScrollVi ...

  9. Vue移动组件库Mint UI的安装与使用

    一.什么是 Mint UI 1.Mint UI 包含丰富的 CSS 和 JS 组件,可以提升移动端开发效率 2.Mint UI 按需加载组件 3.Mint UI 轻量化 二.Mint UI 的安装 1 ...

随机推荐

  1. 目录导航「深入浅出ASP.NET Core系列」

    希望给你3-5分钟的碎片化学习,可能是坐地铁.等公交,积少成多,水滴石穿,谢谢关注. 入门篇 引子 1.1专题介绍 1.2环境安装 1.3创建项目 1.4部署到IIS 1.5准备CentOS和Ngin ...

  2. Java 项目中一种简单的动态修改配置即时生效的方式 WatchService

    这种方式仅适合于比较小的项目,例如只有一两台服务器,而且配置文件是可以直接修改的.例如 Spring mvc 以 war 包的形式部署,可以直接修改resources 中的配置文件.如果是 Sprin ...

  3. jQuery获取或设置元素的宽度和高度

    jQuery获取或设置元素的宽度和高度: 可使用以下3种方法: 1,jQuery width() 和 height() 方法: 2,innerWidth() 和 innerHeight() 方法: 3 ...

  4. Linux基本命令操作

    3.1  Linux终端介绍.Shell提示符.Bash基本语法 3.1.1  登录LINUX终端 两种终端仿真器:1.GNOME桌面的GHOME Terminal : 2.KDE桌面的Konsole ...

  5. SpringBoot学习笔记(一)入门

    1.重新认识Spring 假如临危受命需要开发一个简单的基于Spring的web程序,你该做什么?可能想到一些基本的需要: 项目结构,其中可选择使用Maven或Gradle构建.其中包含例如Sprin ...

  6. Web后端 JAVA学习之路

    1.Java分类 Java按应用来分,可以分为J2ME(手机版),J2SE(标准版),J2EE(企业版)三部分. ・J2ME:已经被安卓开发取代. ・J2SE:Java的核心类,其中包括桌面应用,但一 ...

  7. js高德地图手机定位

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  8. Express NodeJs Web框架 入门笔记

    Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具. 使用 Express 可以快速地搭建一个完整功能的网 ...

  9. 【已采纳】charles工具使用心得

    1.下载charles 可以去charles官网下载,下载地址:http://www.charlesproxy.com/download/    根据自己的操作系统下载对应的版本,然后进行安装,然后打 ...

  10. Go 反射

    基本了解 在Go语言中,大多数时候值/类型/函数非常直接,要的话,定义一个.你想要个Struct type Foo struct { A int B string } 你想要一个值,你定义出来 var ...