TextInput 

官方文档 

TextInput组件icon-default.png?t=N7T8https://developer.harmonyos.com/cn/docs/documentation/doc-references-V3/ts-basic-components-textinput-0000001427584864-V3#ZH-CN_TOPIC_0000001523968610__%E5%AD%90%E7%BB%84%E4%BB%B6

文本输入框组件

接口

TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: TextInputController})

TextInput({text:'请输入用户名'})

参数：

参数名

参数类型

必填

参数描述

placeholder

ResourceStr

否

设置无输入时的提示文本。

text

ResourceStr

否

设置输入框当前的文本内容。

设置输入框当前的文本内容。当组件设置stateStyles等刷新属性时，建议通过onChange事件将状态变量与文本实时绑定，避免组件刷新时TextArea中的文本内容异常。

controller8+

TextInputController

否

设置TextInput控制器。

属性

除支持通用属性外，还支持以下属性：

名称

参数类型

描述

type

InputType

设置输入框类型。

默认值：InputType.Normal

placeholderColor

ResourceColor

设置placeholder文本颜色。

placeholderFont

Font

设置placeholder文本样式。

enterKeyType

EnterKeyType

设置输入法回车键类型。

默认值：EnterKeyType.Done

caretColor

ResourceColor

设置输入框光标颜色。

maxLength

number

设置文本的最大输入字符数。

inputFilter8+

{

value: ResourceStr,

error?: (value: string) => void

}

正则表达式，匹配表达式的输入允许显示，不匹配的输入将被过滤。目前仅支持单个字符匹配，不支持字符串匹配。

- value：设置正则表达式。

- error：正则匹配失败时，返回被过滤的内容。

copyOption9+

CopyOptions

设置输入的文本是否可复制。

设置CopyOptions.None时，当前TextInput中的文字无法被复制或剪切，仅支持粘贴。

showPasswordIcon9+

boolean

密码输入模式时，输入框末尾的图标是否显示。

默认值：true

style9+

TextInputStyle

设置输入框为默认风格或内联输入风格。

默认值：TextInputStyle.Default

textAlign9+

TextAlign

设置输入文本在输入框中的对齐方式。

默认值：TextAlign.Start

说明

通用属性padding的默认值为：

{top: 8 vp,right: 16 vp,bottom: 8 vp,left: 16 vp}

EnterKeyType枚举说明

名称

描述

Go

显示为前往样式。

Search

显示为搜索样式。

Send

显示为发送样式。

Next

显示为下一个样式。

Done

显示为确认样式。

InputType枚举说明

名称

描述

Normal

基本输入模式。

支持输入数字、字母、下划线、空格、特殊字符。

Password

密码输入模式。支持输入数字、字母、下划线、空格、特殊字符。密码显示小眼睛图标并且默认会将文字变成圆点。

Email

邮箱地址输入模式。支持数字，字母，下划线，以及@字符（只能存在一个@字符）。

Number

纯数字输入模式。

PhoneNumber9+

电话号码输入模式。

支持输入数字、+ 、-、*、#，长度不限。

TextInputStyle9+枚举说明

名称

描述

Default

默认风格，光标宽1.5vp，光标高度与文本选中底板高度和字体大小相关。

Inline

内联输入风格。文本选中底板高度与输入框高度相同。

内联输入是在有明显的编辑态/非编辑态的区分场景下使用，例如：文件列表视图中的重命名。

事件

除支持通用事件外，还支持以下事件：

名称

功能描述

onChange(callback: (value: string) => void)

输入内容发生变化时，触发该回调。

value：输入的文本内容。

触发该事件的条件：

1、键盘输入。

2、粘贴、剪切。

3、键盘快捷键Ctrl+v。

onSubmit(callback: (enterKey: EnterKeyType) => void)

按下输入法回车键触发该回调，返回值为当前输入法回车键的类型。

enterKeyType：输入法回车键类型。具体类型见EnterKeyType枚举说明。

onEditChanged(callback: (isEditing: boolean) => void)(deprecated)

输入状态变化时，触发该回调。从API Version8开始，建议使用onEditChange。

onEditChange(callback: (isEditing: boolean) => void)8+

输入状态变化时，触发该回调。isEditing为true表示正在输入。

onCopy(callback:(value: string) => void)8+

长按输入框内部区域弹出剪贴板后，点击剪切板复制按钮，触发该回调。

value：复制的文本内容。

onCut(callback:(value: string) => void)8+

长按输入框内部区域弹出剪贴板后，点击剪切板剪切按钮，触发该回调。

value：剪切的文本内容。

onPaste(callback:(value: string) => void)8+

长按输入框内部区域弹出剪贴板后，点击剪切板粘贴按钮，触发该回调。

value：粘贴的文本内容。

TextInputController8+

TextInput组件的控制器。

导入对象

  1. controller: TextInputController = new TextInputController()

caretPosition

caretPosition(value: number): void

设置输入光标的位置。

参数：

参数名

参数类型

必填

参数描述

value

number

是

从字符串开始到光标所在位置的字符长度。

 
.onClick(() => {
          // 将光标移动至第一个字符后
          this.controller.caretPosition(1)
        })

 

# harmonyos
Logo
HarmonyOS开发者社区

讨论HarmonyOS开发技术，专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐

【推荐+1】HarmonyOS官方模板优秀案例（第13期：运动健康 · 运动健身）

在commons/lib_api/src/main/ets/params/response/AuthorResponse.ets文件中将云侧开发者自定义的数据结构转换为端侧数据结构。│├──home/src/main/ets// 首页模块。│├──mine/src/main/ets// 我的模块。

avatar HarmonyOS开发者社区

星光不负码向未来·1024鸿蒙征文活动圆满落幕，61位开发者斩获荣誉

近日，为期 1 个月的 “” 正式落下帷幕。本次活动由 CSDN 发起，聚焦 HarmonyOS 技术实践与生态共建，吸引了来自高校、企业、独立开发者群体的 200多位创作者参与，累计收到高质量技术稿件 186 篇，内容覆盖鸿蒙开发实战、学习成长、参赛复盘等核心方向，最终经公平评选，61 位开发者脱颖而出，分获四大奖项。一、活动回顾：以文会友，共筑鸿蒙生态作为 1024 程序员节期间的重点技术主题

avatar HarmonyOS开发者社区

鸿蒙新闻行业解决方案助力行业应用体验变革，开发效率提升50%

除流程指导之外，HarmonyOS新闻行业解决方案还提供了丰富的行业开发模板、常用组件及三方SDK等，如官方提供的综合新闻应用模板、新闻资讯元服务模板、频道编辑组件等，三方伙伴提供的新闻客户端应用模板、播放器SDK、个推消息推送SDK等。数字化阅读日益普及的今天，华为聚焦新闻融媒行业应用开发及用户体验需求带来了HarmonyOS新闻行业解决方案，涵盖应用架构、技术路径、HarmonyOS特性能力和

avatar HarmonyOS开发者社区