# @formio/vanilla-text-mask 中文文档

规范地址：https://npmcn.com/package/%40formio/vanilla-text-mask/

版本：5\.1\.1-formio\.1
npm 元数据更新时间：2025-05-23T15:43:52.398Z
中文译文更新时间：2026-11-15T09:03:04.613Z
软件包许可：Unlicense

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40formio/vanilla-text-mask
原文对照：https://npmcn.com/package/%40formio/vanilla-text-mask/?lang=original
项目主页：https://github.com/text-mask/text-mask/tree/master/vanilla/#readme
源码仓库：https://github.com/text-mask/text-mask

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：122 kB，12 个文件
- 模块格式：CommonJS
- TypeScript 类型：未声明
- 运行依赖：0 个
- 首次发布：2021-04-19T17:35:59.471Z
- 最新版本发布：2022-09-13T19:29:42.545Z
- 近 30 天下载量：331537（2026-10-16 至 2026-11-14，npm 官方下载统计）
- 已发布版本数：2（近 12 个月 0 个）

## 中文简介

JavaScript 函数使输入 HTML 元素接受掩码模式

## 安装

```sh
npm install @formio/vanilla-text-mask
```

也可以使用：`pnpm add @formio/vanilla-text-mask`、`yarn add @formio/vanilla-text-mask`、`bun add @formio/vanilla-text-mask`

## README

# Java 脚本输入罩

**说明:** 本模块不支持IE9.

## 开始

首先,安装它.

```bash
npm i vanilla-text-mask --save
```

然后,使用如下:

```html
<script
  type="text/javascript"
  src="./node_modules/vanilla-text-mask/dist/vanillaTextMask.js"></script>
<script type="text/javascript">
  var phoneMask = ['(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/]

  // Assuming you have an input element in your HTML with the class .myInput
  var myInput = document.querySelector('.myInput')

  var maskedInputController = vanillaTextMask.maskInput({
    inputElement: myInput,
    mask: phoneMask
  })
  
  // Calling `vanillaTextMask.maskInput` adds event listeners to the input element. 
  // If you need to remove those event listeners, you can call
  maskedInputController.destroy()
</script>
```

## 文档

从上面的代码中可以看到,您正在传递一个对象到 `vanillaTextMask.maskInput(...)`。 。 。 .

对象要 `inputElement`,这是 `<input/>` 您正在掩盖的元素。 还有 接受其他值为 [此处记录](https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#readme)。 。 。 .

## 示例

要看到代码运行的例子, 请遵循这些步骤 :

1.  切开回转机, `git clone git@github.com:text-mask/text-mask.git`
2.  `cd text-mask`
3.  `npm install`
4.  `npm run vanilla:dev`
5.  打开 [http://localhost:3:00 (英语)](http://localhost:3000/)

示例的代码在 [`vanilla/example`](https://github.com/text-mask/text-mask/tree/master/vanilla/example)。 。 。 .

## 捐款

我们想做点贡献! 检查出来 [此文档](https://github.com/text-mask/text-mask/blob/master/howToContribute.md#readme) 要开始.

## 常见问题

### @formio/vanilla-text-mask 是什么？

JavaScript 函数使输入 HTML 元素接受掩码模式

### 如何安装 @formio/vanilla-text-mask？

在项目目录运行 npm install @formio/vanilla-text-mask，或使用 pnpm add / yarn add / bun add。

### @formio/vanilla-text-mask 支持 TypeScript 吗？

该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/formio\_\_vanilla-text-mask 是否存在。

### @formio/vanilla-text-mask 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @formio/vanilla-text-mask 可以商用吗？

@formio/vanilla-text-mask 使用 Unlicense 许可。作者将代码贡献到公共领域，可不受限制地使用。以上为概括，不构成法律意见，请以许可原文为准。

### @formio/vanilla-text-mask 的下载量有多少？

根据 npm 官方下载统计，@formio/vanilla-text-mask 在 2026/10/16 – 2026/11/14 这 30 天内被下载 331,537 次，日均约 11,051 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @formio/vanilla-text-mask 还在维护吗？

最新版本 5\.1\.1-formio\.1 发布于 2022/09/14（4 年前）；至今共发布 2 个版本，其中过去 12 个月发布了 0 个；首次发布于 2021/04/20。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。