在vue项目中使用 element-ui 组件库时,经常会用到类似 el-breadcrumb面包屑 或者 Dropdown下拉菜单的组件。有时需要在子项上添加click事件,但是官方文档中并没有给出 el-dropdown-item / el-breadcrumb-item 的点击事件。
若直接在el-dropdown-item / el-breadcrumb-item上添加click事件,点击后没有任何反应。
在click后添加 .native 修饰符,则可解决问题。代码示例如下:
<el-dropdown>
<span class="el-dropdown-link">
下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="handleClick">黄金糕</el-dropdown-item>
<el-dropdown-item @click.native="handleClick">狮子头</el-dropdown-item>
<el-dropdown-item @click.native="handleClick">螺蛳粉</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-breadcrumb separator-class