liyupi / yuindex

✨ 新项目 - 极客范儿的浏览器主页 💻 Vue 3 + Node.js 全栈项目,自实现 web 终端 + 命令系统
http://yuindex.yupi.icu
Apache License 2.0
1.96k stars 706 forks source link

修复异步操作后输入框光标不显示的问题 #104

Open 2WeirDo opened 7 months ago

2WeirDo commented 7 months ago

问题 : 异步操作成功之后(一个命令调用了后端api之后), 输入框虽处于聚焦状态, 但是光标不进行显示。 image

经过调试和网络搜索, 我发现问题很可能是由于异步操作影响了DOM元素的焦点状态,如果使用 setTimeout 来延迟设置输入框的焦点,就能有效地解决光标不显示的问题。setTimeout提供了足够的时间让浏览器处理完异步任务并重新渲染UI,从而恢复输入框的正常焦点状态和光标显示。

由于我们调用命令是要进行输出的, 因为我们就在终端的writeTextResult函数最后通过setTimeout(delay设置为0)调用终端的focusInput()方法, 之后再次执行命令, 光标成功显示。

image

LuruiminF commented 7 months ago

这是来自QQ邮箱的假期自动回复邮件。你好,我最近正在休假中,无法亲自回复你的邮件。我将在假期结束后,尽快给你回复。