npm包 object-model-validator 使用教程

阅读时长 11 分钟读完

在前端开发过程中,数据验证是一项重要的任务,能够有效地避免出现许多问题。而npm包 object-model-validator正是一款非常优秀的用于进行数据验证的工具。

什么是object-model-validator?

object-model-validator是一种使用简单的验证库,适用于JavaScript中的数据验证。它具备验证数据模型的完整性和有效性的功能,可以基于预定义的模式(模版)为数据定义验证模型,来进行数据验证。 可以实现以下功能:

  • 定义数据模型:定义数据模型非常简单,只需要一个对象即可。

  • 解析复杂的验证模板:object-model-validator能够解析具有嵌套的详细验证模板,避免重复。

  • 即时验证:每个数据修改操作都可以即时验证,不需要等待整个验证过程。

  • 链式操作 :对象可以通过链式方法的方式进行验证。(支持Promise)

  • 支持错误消息自定义 :可以定义错误消息以匹配您自己的视角和应用程序需要的语言。

  • i18n支持:object-model-validator支持i18n。

安装使用npm包object-model-validator

安装object-model-validator

使用npm进行安装:

用法

创建对象

通过Object.create()创建一个新的对象,并将它传递给Model构造函数:

定义模型及其验证规则

可以在构造函数中通过添加属性或使用Object.defineProperty()为模型添加属性及其验证规则:

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

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

在上述代码中,我们在model对象中添加了三个属性:idnameage。 其中,idname都是必填项。age为选填项,如果提供,其值必须在13到120之间。

验证对象

现在,我们可以使用validate()函数来验证对象:

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

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

在上述示例中,我们将user对象传递给validate()函数。如果验证通过,result.valid将为trueresult.errors将为空对象。 如果未通过,则result.validfalseresult.errors将包含关于哪些验证未通过的详细信息。

链式api使用方式

我们也可以使用链式api方式为模板添加属性及其规则

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

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

验证对象

与前面不使用链式api时相同,可以使用validate()函数验证对象:

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

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

自定义错误消息

我们可以自定义错误消息来与业务场景相符合,可以直接在规则定义中包含message

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

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

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

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

自定义验证函数

object-model-validator支持自定义验证函数,只需要传递一个函数作为指定属性的validator属性值即可:

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

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

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

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

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

通过”type”属性检查类型

object-model-validator允许使用type属性检查属性值的类型:

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

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

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

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

进阶:嵌套验证

支持对象的嵌套验证。 假设我们有一个场景:每个人都有一个地址(位置)对象。我们要验证地址对象并确保它符合预期的规范。可以使用以下代码定义模板:

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

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

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

在上述代码中,我们定义了嵌套的address模板,可以使用它来验证user对象的address属性。 为了在主model中包含address属性,我们使用了properties属性来传递address模板的属性数组。 最后,在验证表单数据时,我们可以使用以下代码:

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

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

结论

object-model-validator是一种非常强大且易于使用的验证工具,能够避免验证代码重复性编写,简化数据验证的过程,也对我们开发过程中的质量提供了更好的保障。无论在什么场景下,object-model-validator将会是前端开发的得力助手之一。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60066f9b3d1de16d83a66e12

纠错
反馈