在开发前端应用时，我们经常需要对用户输入进行格式限制和校验，例如在表单中输入身份证号、手机号、银行卡号等。text-mask-rut 是一个基于 React 的 npm 包，可以帮助我们对 Chilean Run Identification Number （RUT，智利身份证号）进行掩码和格式化。
安装
通过 npm 安装 text-mask-rut：
--- ------- ------------- ------
使用
在 React 项目中引入 text-mask-rut 并使用：
------ ----- ---- --------
------ ------------- ---- ----------------
----- ---- ------- --------------- -
------------------ -
-------------
---------- - -
------ --
--
------------- - -------------------------
-
--------------- -
---------------
------ ------------------
---
-
-------- -
----- - ----- - - -----------
----- ------- - ----------------
------ -
-----
------ -------------
------------------------
-----------------
------------ --
------
--
-
-这段代码会在页面上渲染一个输入框，输入框的格式将会被掩码和格式化，例如输入 123456789，显示的格式将是 12.345.678-9。
参数
text-mask-rut 接受两个可选的参数，可以用来自定义掩码和格式化：
mask：掩码。guide：是否显示掩码。
默认情况下，createRutMask 函数会使用 '.' 和 '-' 作为掩码，并且始终显示掩码，因此不需要传入任何参数。如果需要自定义掩码和格式化，可以通过以下代码实现：
------ ----- ---- --------
------ ------------- ---- ----------------
-- ---------
----- --------- - ---------------
----- ----- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- -----
------ -----
---
----- ---- ------- --------------- -
------------------ -
-------------
---------- - -
------ --
--
------------- - -------------------------
-
--------------- -
---------------
------ ------------------
---
-
-------- -
----- - ----- - - -----------
------ -
-----
------ -------------
------------------------
-----------------
-------------- --
------
--
-
-这段代码会将掩码变成 NN.NNN.NNN-AA，并且不显示实际的掩码。
深度
text-mask-rut 能够正确地对 Chilean Run Identification Number 进行掩码和格式化，这是因为它涉及到了智利身份证号的校验规则。
智利身份证号由两部分组成，一部分是身份证号码本身，另一部分是校验码。身份证号码通常是 8 位或 9 位，校验码是一个数字或字母，用于验证身份证号码。校验码的计算方法非常特殊，需要进行一系列复杂的运算。
text-mask-rut 应用了这些规则，并使用了 text-mask 和 react 的强大功能来实现智利身份证号码的掩码和格式化。因此，使用 text-mask-rut 的用户可以自信地控制智利身份证号码的输入，而无需担心数据的准确性。
学习以及指导意义
通过阅读和使用 text-mask-rut，开发人员可以更好地理解前端控件和用户输入的相关技术。text-mask-rut 的源代码是公开的，可以帮助初学者更深入地了解 React 和 text-mask 的内部机制和设计思想。
尽管 text-mask-rut 是一个针对智利身份证号的 npm 包，但是它的设计和实现思路可以应用于其他的用户输入校验和掩码。为了更好地理解和掌握该技术，开发人员可以自行实现其他类型的输入校验和掩码，或者将 text-mask-rut 扩展到其他类型的控件中。
示例代码
完整的示例代码：
------ ----- ---- --------
------ ------------- ---- ----------------
-- ---------
----- --------- - ---------------
----- ----- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- -----
------ -----
---
----- ---- ------- --------------- -
------------------ -
-------------
---------- - -
------ --
--
------------- - -------------------------
-
--------------- -
---------------
------ ------------------
---
-
-------- -
----- - ----- - - -----------
------ -
-----
------ -------------
------------------------
-----------------
-------------- --
------
--
-
-来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005a04481e8991b448ed4f8