在 uniapp 中,input 组件常用的触发事件有以下几种:
-
@input触发条件:用户输入时触发。
用法:绑定输入事件,常用于获取输入框的值。
示例:
html<input type="text" @input="handleInput" /> -
@focus触发条件:输入框获得焦点时触发。
用法:在输入框获得焦点时执行某些操作,如改变样式或显示提示。
示例:
html<input type="text" @focus="handleFocus" /> -
@blur触发条件:输入框失去焦点时触发。
用法:在输入框失去焦点时执行某些操作,常用于校验输入内容等。
示例:
html<input type="text" @blur="handleBlur" /> -
@confirm触发条件:键盘确认键(如回车键)被按下时触发。
用法:通常用于提交表单或执行特定操作。
示例:
html<input type="text" @confirm="handleConfirm" /> -
@change触发条件:输入框的内容发生变化时触发,通常用于文本框内容变化后的后续处理。
用法:监控输入框内容变化,并执行相关操作。
示例:
html<input type="text" @change="handleChange" /> -
@input和@change的区别
@input会在每次输入时触发,而@change是在输入框内容变化后触发。一般来说,@input触发更频繁。 -
@keyup/@keydown触发条件:分别在键盘按键松开(keyup)和按下(keydown)时触发。
用法:用于捕获键盘事件,控制输入框行为。
示例:
html<input type="text" @keyup="handleKeyUp" /> -
@keypress触发条件:用户按下一个字符键时触发。
用法:监控特定键的输入,通常用于防止输入非法字符等场景。
示例:
html<input type="text" @keypress="handleKeyPress" />
小结
常用的事件是 @input、@focus 和 @blur,它们分别用于获取输入值、处理焦点事件和失去焦点事件。根据你的需求,选择合适的事件进行绑定。