element-ui select 点击事件无效

最新推荐文章于 2024-01-08 17:23:18 发布
最新推荐文章于 2024-01-08 17:23:18 发布
阅读量3.4k 收藏 1
点赞数
分类专栏： element-ui vue HBuilderX 文章标签： vue elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36478297/article/details/109242485
版权

用第三方组件或者UI框架会自带自身封装的事件，如keyup,click等，会覆盖原生的事件，从而无法起效果。.native 修饰符就是用来注册元素的原生事件而不是组件自定义事件的。
代码示例：

<el-select v-model="value" ref="select" placeholder="请选择">
最低0.47元/天 解锁文章
小米小米呀
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
element-ui-update:elementui源码修改
03-23
import Element from 'element-ui' Vue . use ( Element ) // or import { Select , Button // ... } from 'element-ui' Vue . component ( Select . name , Select ) Vue . component ( Button . name , Button ...
省市县联动element-ui插件
06-24
在Element-UI中，我们可以使用`el-select`组件来创建下拉菜单，通过绑定`v-model`来同步用户的选择。同时，我们需要利用`@change`事件来监听用户的选择变化，一旦省份发生变化，就触发获取城市和县区数据的函数。 ...
select和 el-select下拉框el-option中添加点击事件
最新发布
null
01-08 2357
在el-option里直接写@click发现没反应
Elementui select 设置点击事件，在Change事件前触发
凉城玖的博客
03-18 1万+
想要在changge事件触发前，来触发一个事件，可以直接在 Select 选择器上面添加点击事件，但是这样点击事件是不会生效的，需要在点击事件后面加上native <el-select v-model="list.userJumpId" clearable placeholder="请选择二跳页名称/ID" style="width: 250px" :disabled="use
Element u中el-select、el-row、el-dropdown-item等等标签添加@click事件无效解决方法
qq_42483780的博客
04-12 999
如下： <el-row @click.native="handle"></el-row> //js handle(){ console.log('我生效啦') } 重点：在@click后加上.native 原因：vue封装@click这些方法时阻止了原生的DOM事件，而native就是释放DOM原生事件。
解决element下拉菜单子选项click事件
qq_43486347的博客
04-03 4264
解决element下拉菜单子选项click事件 <el-select v-model="value" placeholder="中文" > <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" ...
el-select allow-create不生效问题
qq_36775019的博客
08-26 1651
filterable allow-create //与filterable 连用才会生效
vue element-ui select下拉框点击事件不起作用
qq_42739199的博客
03-10 2035
常规写法不起作用 @click=‘change’ <el-select v-model="value" filterable placeholder="请选择" @click='change' > <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.val...
Element-ui中元素滚动时el-option超出元素区域的问题
10-16
然而，Element-ui的实现中，scroll事件并不支持冒泡，所以这种方法无效。 3. 方案三：深入Element-ui的源码，找到控制popperEl显示隐藏的实例属性。在`select.vue`组件中，`visible`属性决定了popperEl的可见性。...
element-ui组件中input等的change事件中传递自定义参数
12-29
以select为例，如果select写在循环里，触发change事件时可能不只需要传递被选中项的值，还要传递index过去，来改变同一循环中的其他标签的状态。 下面这样写是无效的： @change=changeStatus(val, index) <div v-...
【JavaScript源代码】Element-ui 自带的两种远程搜索(模糊查询)用法讲解.docx
12-28
Element-ui 自带的两种远程搜索(模糊查询)用法讲解 　有一种查询叫做前端远程搜索、模糊查询。饿了么自带两种方式可以做，一种是使用el-input中的el-autocomplete，另一种是使用el-select和el-option。这两种都可以...
vue element-UI使用el-select时@change不能触发的解决方案（通过el-option @click.native原生方法）
热门推荐
★【World Of Moshow 郑锴】★
10-18 2万+
前言 在下刚入门VUE不久，最近有个项目的页面进行了VUE改造，使用的是 element-UI ，其中有个功能如下，有一下拉选择列表：证书类别，选择其中某个证书类别，自动根据证书类别设置的前缀填写到证书编号的输入框中去。 按道理这是一个onChange事件，也就是el-select的@Change事件可以搞定，但是却多次输出的undefined，最后通过改变思路，使用了el-option的@click.native的原生方法来实现。 源代码+解决方案 源代码+解决方案一起验证，忽略其他细节不看，我们可以发
vue elementUI select下拉点击事件无反应解决
疑问 搜索 动手 解决 记录
08-21 4821
点击下图中的select列表时,无法触发点击事件 代码为 解决办法为: <el-form-item label="指定创建部门" v-if="form.navigationLevel ==2" prop="deptId "> <!-- <el-input v-model="form.deptId " placeholder="请选择部门名字"/> --> <el-select v-model="fo
vue3+elementui Plus 表单select下拉框选中后无效？
weixin_55341181的博客
07-11 3333
使用了纯vue3写法写了个下拉框，出现了个莫名其妙的bug，就是下拉选中后无效。示例： 代码： 下拉框选中后就是无法回显，打印出来的form对象也没有选中的数据。打印： 解决方案：就是form的model变量名和ref的名字重复了，把两个其中一个改下就好了，保证不重名。 总结：form的model和ref重名会出现很多奇奇怪怪的bug 大概是冲突吧 但是这个问题在vue2是没有遇到过的。......
Element-UI Select下拉框点击事件不触发问题解决方法
qq_46199553的博客
01-14 2304
后端检查了端口，我认为后端错误，结果是@click没有添加.native，真是无语，下面是修改方法 <el-form-item label="药品名称" :label-width="formLabelWidth"> <el-select v-model="form.dname" placeholder="请选择药品名称" @click.native="choicedrug"> <el-option .
El-Select 下拉选择无反应 无法选择 Vue设置属性不触发响应
a571574085的博客
10-22 5595
this.dialog.forms ={ roomCode: ""}; 下拉选择才有反应 下拉选择时会触发 this.$emit('input', value); 进而触发ast生成的代码: callback: function($$v) { _vm.$set(_vm.dialog.forms, "roomCode", $$v)}, 为什么? 因为渲染时 createComponent->是v-model的话会触发transformModel->on[event].
El-Select 下拉选择无反应 无法选择
全盛
02-25 3689
场景: 已知El-Select的v-model=‘dialog.forms.roomCode’ 原因: 你在手动触发改变之前,使用了 dialog.forms.roomCode = xxx; 给v-model赋值 解决办法1: this.$set(this.dialog.forms,'roomCode ',xxx); 解决办法2: this.dialog.forms ={ roomCode: “”}; //下拉选择才有反应 原理读源码可知: 下拉选择时会触发 this.$emit('input', val
vue element plus对话框第二次点击时 选择器不显示
niyooooo的博客
04-19 2073
第一次点击时下拉框出现正常，关闭窗口后再次进入，选择器的下拉框不会出现 可给选择器设置属性:teleported="false" 但是这样写后日期选择器显示不全，
el-select组件绑定change事件踩坑
qq_27470647的博客
04-14 2万+
要注意区分elementUI组件（比如el-select、el-button、el-input等组件）的focus、click、change等事件和DOM的focus、click、change原生事件，二者是不一样的。如果要在element组件上触发原生事件，一律都得加.native修饰符，否则无法触发事件。但是要注意很多elementUI的组件本身封装了focus、click、change等事件...
element-ui中el-select绑定函数
07-28
- *2* [element-ui 解决 el-select 设置初始默认值后切换选项无效问题](https://blog.csdn.net/sea9528/article/details/121403975)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值