npm包 mvalidator 使用教程

mvalidator 可以用于验证输入是否合法。在前端开发中，很多表单都需要验证输入的合法性，如邮箱、电话号码、日期等。

安装

使用 npm 进行安装：

--- ------- ---------- ------

使用方法

--- ---------- - ----------------------

isEmail(email)

验证邮箱格式是否正确，返回值为 Boolean 类型。

--- ------- - ---------------------------------------
--------------------- -- ----

isMobilePhone(phone, locale)

验证电话号码是否正确，返回值为 Boolean 类型。locale 为手机号码的国际化区号，可以传入 'zh-CN' 表示中国区号。

--- ------------- - --------------------------------------- ---------
--------------------------- -- ----

isDate(str)

验证日期格式是否正确，返回值为 Boolean 类型。

--- ------ - --------------------------------
-------------------- -- ----

实践示例

表单验证

在表单提交时进行验证，若输入格式不正确则阻止表单提交。

----- ---------------- ------------
  ------ -----------------------
  ------ ------------ ---------- ---------
  ----
  ------ -----------------------
  ------ ---------- ---------- ---------
  ----
  ------ ----------------------
  ------ ----------- --------- ---------
  ----
  ------- -------------------------
-------
-------- ---------- -
  --- ----- - ---------------------------------------
  --- ----- - ---------------------------------------
  --- ---- - --------------------------------------
  
  -- ---------------------------- -
    -----------------
    ------ ------
  -
  
  -- --------------------------------- --------- -
    -----------------
    ------ ------
  -
  
  -- -------------------------- -
    -----------------
    ------ ------
  -

  ------ -----
-

注意事项

mvalidator 只验证输入格式是否正确，非输入内容是否合法。如手机号码是否存在，需要使用其他方式进行验证。

来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005663b81e8991b448e23aa

阅读全文

猜你喜欢

  • npm 包 cronjobjs 使用教程

    什么是 cronjobjs cronjobjs 是一个用于创建和处理 cronjob 的 npm 包，cronjob 是一种让你能够在指定时间执行任务的机制，通常用于定期执行某些操作。

    3 年前
  • npm 包 jnclude 使用教程

    在前端开发中，我们经常需要引用外部 JS 或 CSS 文件来实现各种功能。通常情况下，我们需要手动在 HTML 页面中添加 script、link 标签引用这些文件。

    3 年前
  • npm 包 botkit-storage-mongoose 使用教程

    在 bot 开发过程中，我们需要保存和管理用户数据，而 MongoDB 是现在最流行的 NoSQL 数据库之一。botkit-storage-mongoose 是一个 npm 包，它提供了基于 Mon...

    3 年前
  • npm 包 swagger-express-validator-formats 使用教程

    前言 对于前端开发人员而言，了解如何使用 npm 包对于开发过程中大有裨益。在本篇文章中，我们将会介绍一个非常实用的 npm 包：swagger-express-validator-formats，以...

    3 年前
  • npm包poolq使用教程

    介绍 npm包poolq是一个能够获取使用者池队列的库。 安装和使用 在命令行中执行以下命令安装poolq ： --- ------- -----在我们要使用的文件中，导入或引用poolq模块： --...

    3 年前
  • npm 包 npmliar 使用教程

    随着前端技术的不断发展，越来越多的开发者会选择使用 npm 包来管理项目依赖。npmliar 是一个非常有用的 npm 包，可以帮助我们快速地查找和管理依赖。在本文中，我们将深入探讨 npmliar ...

    3 年前
  • npm 包 frame-loader 使用教程

    在前端开发中，很多情况下我们需要在页面中引入其他网站或者页面的内容，比如广告或者嵌入式页面。这时候就需要使用 iframe 标签来实现。但如果需要在 iframe 中加载一个完整的页面，那么就需要使用...

    3 年前
  • npm 包 cerebro-windowfinder 使用教程

    介绍 Cerebro-windowfinder 是一个可以实现在桌面应用中查找窗口、切换窗口的快捷工具。它可以被集成到各种前端开发工具中，如 VSCode、Sublime Text、IntelliJ ...

    3 年前
  • npm 包 censorify-billychan 使用教程

    简介 censorify-billychan 是一款用于文本过滤的 npm 包，可以用于在前端、后端或命令行下进行文本过滤处理。该包实现了对指定文本中的敏感词汇进行替换、删除等操作，支持自定义敏感词汇...

    3 年前
  • npm 包 react-infinite-scroll-waypoint 使用教程

    在前端开发中，实现无限滚动是非常常见的需求，它可以带来更好的用户体验，也可以加快网站或应用的加载速度。而 react-infinite-scroll-waypoint 是一个非常好用的 npm 包，可...

    3 年前
  • npm 包 react-native-blockies 使用教程

    1. 什么是 react-native-blockies react-native-blockies 是一个生成 Blockies 的 React Native 包。

    3 年前
  • npm 包 pmod 使用教程

    简介 pmod 是一个开源的 npm 包，用于简化 JavaScript 中对于操作 DOM 的需求。它提供了一种友好的方式来管理页面上的元素，让开发者可以更加专注于业务逻辑的实现，而无需过多地关注 ...

    3 年前
  • npm 包 @jemmyphan/react-native-md-textinput 使用教程

    随着移动端应用的普及，React Native 的应用场景也越来越广泛。而一个好的用户界面设计是吸引用户的重要因素之一。@jemmyphan/react-native-md-textinput 是一个...

    3 年前
  • npm 包 yarn-lock-cli 使用教程

    简介 在前端开发中，我们经常需要管理项目的依赖项，其中一个非常重要的工具就是 npm。npm 是一个包管理器，可以让我们方便地安装、升级和管理 JavaScript 包。

    3 年前
  • npm 包 is-listening 使用教程

    在前端开发中，我们经常会需要使用到网络通信功能，而网络通信功能要起作用，就必须保证服务端的监听端口是打开的。为了方便判断服务端是否处于监听状态，我们可以使用 npm 包 is-listening。

    3 年前
  • npm 包 magnifique-rest 使用教程

    前言 在前端开发过程中，我们总会遇到需要与后台进行数据交互的情况。如何高效地完成这些工作显得非常重要。在这篇文章中，我将介绍一个非常实用的 npm 包——magnifique-rest，该包提供了一套...

    3 年前
  • npm 包 ngx-pubsub 使用教程

    在前端开发中，很多时候不同组件或模块之间需要进行数据交互，而通过传递参数或 props 等方式实现通信可能并不是非常方便或直观。因此，在这种情况下，我们可以使用订阅-发布模式来完成组件之间的数据通信。

    3 年前
  • npm 包 mdi-es6 使用教程

    在前端开发中，我们经常需要使用各种图标来装饰我们的页面。Material Design Icons (MDI) 是一套普及度极高的开源图标库，其中包括了各种应用场景下常用的图标。

    3 年前
  • npm 包 dragdrop-js 使用教程

    在前端开发中，拖拽功能是非常常用的功能。采用 JavaScript 实现拖拽功能需要编写大量的代码。这就是为什么开发者们希望使用现成的模块来实现这个功能。而 npm 包 dragdrop-js 就是一...

    3 年前
  • npm包 @jemmyphan/react-native-day-picker使用教程

    介绍 React Native Day Picker是一个前端开发工具包，可用于创建可定制和交互式的日期选择器。它是一个 npm 包 @jemmyphan/react-native-day-picke...

    3 年前

相关推荐

    暂无文章