javascript - 如何关注组件

标签 javascript vue.js

我在我的项目中使用“keen-ui”库。这是 special component用于选择项目。我想处理来自另一个组件的事件并对此设置焦点,但我不知道该怎么做。

另一个组件,里面有<input/>标签可以像this.$refs[component name].$el.children[0].children[1].focus一样被聚焦, 其中children[0].children[1]<input/>元素。这很丑陋,但如果组件不包含 input 标签,我们甚至不能这样做。

最佳答案

检查这些小部件,我发现它们包含一个带有 tabindex="0"div,这意味着它们可以接收焦点。

如果你在组件上有一个ref,你应该可以做类似的事情

const focusableEl = this.$refs.uiselect.querySelector('[tabindex="0"]');
focusableEl.dispatchEvent(new Event('focus'));

然后小部件将亮起。我实际上是从控制台这样做来测试它的。有趣的是,blur 对我不起作用。

关于javascript - 如何关注组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49761516/

相关文章:

php - 如果我单击重置按钮重置不同表单上的单选按钮,我如何清除可能的表数据

javascript - 哪种做法更好 : v-show(true/false) or replaceWith? Vue vs jQuery

javascript - 在 bootstrap-vue 中渲染自定义样式

javascript - JS : What's wrong with this? 尝试单击链接以弹出 window.prompt

javascript - 如何从 jQuery 中的 $.post() 返回变量?闭包变量?

javascript - DOM/Vanilla Javascript 相当于 jquery 的 .is (':empty' )

node.js - 表示不发送静态目录

vue.js - vue中输入失去焦点时如何执行函数

vue.js - 如何将数据添加到 Kotlin 对象并在 Vuejs 页面上获取它

javascript - 使用 chrome 扩展中的上下文菜单将文本添加到文本框