HarmonyOS 鸿蒙Next中疑似TextInput组件onBlur()事件的BUG

HarmonyOS 鸿蒙Next中疑似TextInput组件onBlur()事件的BUG 先上效果GIF

我做的是一个打字软件，当用户一个字一个字输入时，能正确触发TextInput组件的onBlur()事件。当用户在输入法中预上屏输入了多个字，然后输入到TextInput中时，我做了一个逻辑判断，让它比对后N个字的正确答案，如果用户输入的字符串和后N个字能对得上，那么输入框焦点跳到当前往后第N个输入框，并回填正确的字符串进每一个单独的Input框中（吐槽一下这个功能实现起来不容易，至少我的是ComponentV1版本，没有像Vue那样通过Ref找到每个子组件的引用然后修改里面的值）。我是通过创建一个inputValues:Array<string>管理所有输入字符的状态，将每个输入的值加入到这个数组中，然后将每个TextInput的text属性跟inputValues内的元素绑定，然后用handleInputChange（在父组件中）方法，通过子组件的回调事件通知父组件重新生成一遍inputValues（仅改变要变化的值），来触发UI的响应式更新，这和Vue早期版本的诟病很像，text不能直接绑定数组中的某个对应的元素的值，非要曲线救国很不优雅。我上图大家就应该理解了：

这样每个Input框的值能动态响应的问题解决了。但是重点来了，我发现Input的onBlur()方法好像出Bug了。我的方法是这样写的：

意思就是当输入框失去焦点时，使得输入框边框的颜色变成透明色。控制焦点我是用上图的focusControl来实现的。然后就出现了开头视频中的：单个字输入能正确触发onBlur()，但是多个字输入就不行了。。。这是BUG吗，如果不是，能给出具体解决思路吗？求各路大神指点！

更多关于HarmonyOS 鸿蒙Next中疑似TextInput组件onBlur()事件的BUG的实战教程也可以访问 https://www.itying.com/category-93-b0.html

phonegap100 1楼

问题虽然解决了。解决方法是在TextInput组件的onChange()时间里面给输入正确的代码段（每次键入汉字时都会触发逻辑判断，当输入的值等于正确的值就进入该“输入正确”的代码段）里再加上this.currentColor = Color.Transparent 这样的语句强制触发UI重新渲染。虽然只加了一行代码就解决问题了。但是我还觉得onBlur()事件没被触发是个BUG，可能涉及底层代码的执行顺序问题。工单我也提交了，看官方怎么回复吧。

更多关于HarmonyOS 鸿蒙Next中疑似TextInput组件onBlur()事件的BUG的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

zlyuanteng 2楼

根据描述，TextInput组件的onBlur事件在单字输入时正常触发，但多字预输入后无法触发，可能是由于焦点切换逻辑与状态更新时序冲突导致。建议检查以下两点：

焦点控制与状态更新的时序：在批量回填字符串并切换焦点时，确保focusControl的更新发生在UI渲染完成之后。可尝试使用setTimeout或nextTick机制延迟焦点切换，避免因状态更新尚未完成而干扰事件触发。
事件冒泡与阻止默认行为：多字输入可能涉及输入法组件的内部事件处理，确认是否因事件冒泡被拦截。可尝试在onBlur回调中显式调用e.stopPropagation()，或检查输入法是否阻止了默认的失焦行为。

若问题仍存在，可能是框架层面的兼容性问题，建议提供最小化复现代码片段以便进一步排查。