天天看点

element-ui select 点击事件无效

用第三方组件或者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 修饰符。