# @axa-ch/input-text 中文文档

规范地址：https://npmcn.com/package/%40axa-ch/input-text/

版本：6\.4\.2
npm 元数据更新时间：2026-08-06T09:11:32.317Z
中文译文更新时间：2026-11-07T21:10:30.233Z
软件包许可：Copyright 2019 AXA Versicherungen AG

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

原始 npm 页面：https://www.npmjs.com/package/%40axa-ch/input-text
原文对照：https://npmcn.com/package/%40axa-ch/input-text/?lang=original
项目主页：https://github.com/axa-ch-webhub-cloud/pattern-library/tree/develop/src/components/10-atoms/input-text#readme
源码仓库：https://github.com/axa-ch-webhub-cloud/pattern-library

弃用说明：Please use the new scope @axa-ch-webhub-cloud

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

- 包体积（解压后）：71.7 kB，7 个文件
- 模块格式：CommonJS
- TypeScript 类型：未声明
- 运行依赖：2 个
- 首次发布：2019-06-06T15:50:53.832Z
- 最新版本发布：2023-03-06T14:09:35.518Z
- 近 30 天下载量：2535（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：101（近 12 个月 0 个）

## 中文简介

AXA 图案库的输入文本组件

## 安装

```sh
npm install @axa-ch/input-text
```

也可以使用：`pnpm add @axa-ch/input-text`、`yarn add @axa-ch/input-text`、`bun add @axa-ch/input-text`

## README

# AXA 输入文本

<axa-input-text>组件是HTML <input>元素的包装器,具有自定义的样式和额外的功能. 它接受大部分与 HTML (输入) 相同的属性,但带有 `type`仅限于 `type=text`, (中文(简体) ), `type=email`,或 `type=password`。 。 。 .

## 属性

### 类型

要显示的输入元素类型 .

| 属性 | 细节 |
| --- | --- |
| `type="text"` | (默认) |
| `type="email"` | 电子邮件 |
| `type="password"` | 密码 |

### 标签

字符串值 `label` 以 HTML 提供标签文本.

_注:应用程序负责对HTML进行消毒!_

### 调试

字符串值 `refId` 设置标签和输入的参考ID。 如果没有 `refId` 设置,将创建随机ID.

### 名称

字符串值 `name` 为提交表格的目的可设定要素.

_注:见 [规格](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#naming-form-controls:-the-name-attribute) 详细情况._

### 最大长度

数字 `maxLength`在定义时,限制用户可以输入的字符数量. 基本的本地“输入”执行 `maxLength` ,在字符限制超过时屏蔽用户输入.

如果 `maxLength` 财务报告和审定财务报表 `counter` 提供.

UI的剩余特征信息(参见 `counter`(但将使用) `maxLength - 1` 可以在内部提供0个字符的预告。 击出字符时会限制“ 达到的特性限制 ! ” 错误消息( 见 `counterMax`改为显示.

### 计数器

字符串值 `counter` 定义 UI 的剩余字符信息与 `maxLength`。 。 。 .

有效 `counter` 值为:

-   空字符串,该字符串将使该字符计数不被显示.
-   非空字符串后缀, 将附加在所剩字符数中
-   一个包含"□相会□"的字符串模板,这样,比如"仍然□相会□相会□相会□相会□相会"将产生像"还剩下九个相会"这样的即时文字.

### 反马克

字符串值 `counterMax` 定义用户在到达时将看到的验证错误消息 `maxLength` 字符键.

### 所需经费

布尔属性 `required` 可视化必须强制由用户填充的元素 。 当设定为真时, 元素会显示 `*` 在标签文本后.

### 占位符

字符串值 `placeholder` 指定元素为空时显示的占位符文本.

### 无效

布尔属性 `invalid` 用于表示该要素的有效性(默认: `false`) (中文(简体) ). 如果设置为 `true` 它将元素设置为视觉错误状态.

### 检查马克

布尔属性 `checkMark`,在设置为正则时,显示输入右侧的动画检查标记(默认: `false`) (中文(简体) ).

### 价值

字符串值 `value` 设置基础本地 HTML < input > 的值

### 默认值

字符串值 `defaultValue` 只能用于反应.

喜欢 `value`,它设置了基础本地 HTML < input > 的值 -- _不过_ 只有一次,在第一次渲染.

### 已禁用

布尔属性 `disabled` 禁用本地 HTML < input > 文本.

### 只读

布尔 `readonly` 属性,当存在时,使基础的本地 HTML < input > 文本不发生变异,意味着用户不能编辑控件.

### 错误

字符串值 `error` 作为 HTML 提供错误文本.

这是当 `invalid` 这是真的.

### 资讯

字符串值 `info` 以 HTML 提供标签文本.

_注:应用程序负责对HTML进行消毒!_

### 模式

这是一个字符串值 。 但是只要输入一个有效的 RegEx. 用于打开iOS触控设备上的数字键盘. 详情见HTML官方文档.

默认 : `.*`。此 RegEx 不限制任何输入。 此时空字符串会给窗体验证造成错误,因为它只是允许输入空字符串.

### 输入模式

这是一个字符串值 。 用于打开触摸设备上的数值键盘 。 详情见HTML官方文档.

### 自动聚焦

Boolean 属性自动焦点, 当为真时, 在组件初始渲染后, 设置键盘聚焦于基本本地的"输入"元素 .

### 货币

你可以设置 `currency` 属性到有效的 [ISO 4217 货币编码](https://en.wikipedia.org/wiki/ISO_4217) 绳子。 当设定时, < 输入- 文本 > 格式化输入 `onBlur` 内部输入元素起火,以及设定时 `value` 方案方面。 请注意,“样式”仍固定为 `de-CH`。 。 。 .

货币格式化只在属性时活动 `type` 设置为 `text`。格式不接受只有字母("100")或小数分隔符以上的数值("12.30.1").

请注意结合使用货币格式 `maxLength`。格式化的结果可能超过 `maxLength`来啊!

### 自动补全

布尔属性 `autocomplete` 将 HTML 自动完整属性放入"On" 。 默认为"关闭"

## 回电

### 变化

函数值财产 `onChange` 可用作React和其他框架的回调道具. 如果您是 Typescript 用户, 您必须声明输入Event 目标是一个输入元素 . `(event.target as HTMLInputElement).value`

它的第一个论点是原文 `change` 从元素的内在“输入”字段.

第二个论点是布尔旗 `invalidFormat` 如果且只有在用户的输入不能被格式化为货币的情况下,才是正确的.

### 焦点

函数值财产 `onFocus` 可用作React和其他框架的回调道具.

它唯一的论据是原著 `focus` 从元素的内在“输入”字段.

### 布莱尔

函数值财产 `onBlur` 可用作React和其他框架的回调道具.

它唯一的论据是原著 `blur` 从元素的内在“输入”字段.

### 键盘下

函数值属性 `onKeyDown` 可用作React和其他框架的回调道具.

每一次都会引用回调 _用户密钥下移_ 在输入字段.

### 键盘

函数值属性 `onKeyUp` 可用作React和其他框架的回调道具.

每一次都会引用回调 _用户密钥上传_ 在输入字段.

### 标签

当用户通过浏览器的用户界面启动"paste"动作时,粘贴事件被解除.

## 方法

### 重点( )

这个 `focus()` 方法聚焦基础的本地 HTML < input>.

它的UI后果与键盘/mouse启动的焦点相同.

### 模糊( c)

这个 `blur()` 方法解开本地 HTML 输入.

它的UI后果与键盘/mouse所引发的模糊相同.

## 常见问题

### @axa-ch/input-text 是什么？

AXA 图案库的输入文本组件注意：该包已被作者标记为弃用——Please use the new scope @axa-ch-webhub-cloud

### 如何安装 @axa-ch/input-text？

在项目目录运行 npm install @axa-ch/input-text，或使用 pnpm add / yarn add / bun add。

### @axa-ch/input-text 支持 TypeScript 吗？

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

### @axa-ch/input-text 支持 ESM 还是 CommonJS？

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

### @axa-ch/input-text 可以商用吗？

@axa-ch/input-text 使用 Copyright 2019 AXA Versicherungen AG 许可。声明的许可为 Copyright 2019 AXA Versicherungen AG，请阅读许可原文确认使用条件。以上为概括，不构成法律意见，请以许可原文为准。

### @axa-ch/input-text 的下载量有多少？

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

### @axa-ch/input-text 还在维护吗？

最新版本 6\.4\.2 发布于 2023/03/06（3 年前）；至今共发布 101 个版本，其中过去 12 个月发布了 0 个；首次发布于 2019/06/06。作者已将其标记为弃用，新项目建议寻找替代方案。