element Select选择器通过js自动展开下拉框

最新推荐文章于 2024-06-21 16:44:44 发布

Xyaleo

最新推荐文章于 2024-06-21 16:44:44 发布

阅读量5.3k

点赞数 11

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/weixin_44260928/article/details/125898604

版权

今天做项目的时候遇到一个问题：怎么通过js而不是鼠标直接点击，来让el-select的option下拉框展开。

查阅官方文档后，发现有个focus方法能够获取input的焦点：
于是写上代码this.$nextTick(_ => { this.$refs[val].focus(); });,结果是input框确实是选中的，但是我想要的下拉框却没有展开。
查找官方文档没有得到答案，而网上的文章只找到一个相关的：element select 自动展开_原生js 让下拉框自动展开可用size 属性来代替展开动作…
看了文章之后感觉还是比较麻烦，就去看了下element的源码，发现select的点击事件为toggleMenu函数，我们可以通过调用这个函数触发下拉框的显示。
实现代码:this.$nextTick(_ => { this.$refs[val].toggleMenu(); });