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