Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程

创建一个Harmony OS 的JS项目

打开Deveco Studio,Create Project(新建项目)选择Empty Ability,然后点击Next

Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程

选择api6

Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程

如下图设置(language选择JS),点击finish

Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程

稍等片刻,等待项目创建完毕。

编写代码

index.html代码:

其中text组件中的input是变量,@change为绑定输入框改变的事件,见官方文档

Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程

这是HTML代码:

Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程 <div class=“container“><input @change=“change“></input> <text> {{input}} <!-- input 为变量--> </text></div>

下面处理JS:

其中在data中定义变量:input,且input的值为空

inputValue为官方文档(见上文的参数)

下面在input事件中,给到value:inputValue参数为输入框(input)的数据

this.input = inputValue则表明将inputValue(输入框的数据)赋值给input里面

Harmony OS鸿蒙(JavaScript/JS)获取输入框(input)数据,响应输入事件并且获得参数教程 export default { data: { input:““ }, input({ value:inputValue }){ this.input = inputValue }}

即实现了读取输入框里面的文字来显示出来的效果!

极客网企业会员

免责声明:本网站内容主要来自原创、合作伙伴供稿和第三方自媒体作者投稿,凡在本网站出现的信息,均仅供参考。本网站将尽力确保所提供信息的准确性及可靠性,但不保证有关资料的准确性及可靠性,读者在使用前请进一步核实,并对任何自主决定的行为负责。本网站对有关资料所引致的错误、不确或遗漏,概不负任何法律责任。任何单位或个人认为本网站中的网页或链接内容可能涉嫌侵犯其知识产权或存在不实内容时,应及时向本网站提出书面权利通知或不实情况说明,并提供身份证明、权属证明及详细侵权或不实情况证明。本网站在收到上述法律文件后,将会依法尽快联系相关文章源头核实,沟通删除相关内容或断开相关链接。