element-ui select 点击事件无效

14 篇文章 0 订阅
12 篇文章 1 订阅

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

<el-select v-model="value" ref="select" placeholder="请选择">
	<el-option
		v-for="item in options"
		:key="item.value"
		:label="item.label"
		:value="item.value"
		@click.native="getItem(item)"
	></el-option>
</el-select>
getItem(item){
	console.log(item);
	},

在 Vue 2.0 中,为自定义组件绑定原生事件必须使用 .native 修饰符:
<my-component @click.native=“handleClick”>Click Me
从易用性的角度出发,elment-ui对 Button 组件进行了处理,使它可以监听 click 事件.
<el-button @click=“handleButtonClick”>Click Me
但是对于其他组件,还是需要添加 .native 修饰符。

  • 0
    点赞
  • 1
    收藏
  • 打赏
    打赏
  • 0
    评论

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

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:书香水墨 设计师:CSDN官方博客 返回首页
评论

打赏作者

小米小米呀

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值