[element-ui] el-dropdown 触发显示时阻止事件冒泡 .stop

如果el-tree自定义节点包含el-dropdown，为了防止点击el-dropdown的触发按钮而执行el-tree的node-click事件

最外层添加div，给div绑定事件并添加事件修饰符（stop）

登录后复制

<el-tree :data="treeData" @node-click="treeNodeClickEvent">
    <div @click.stop>
        <el-dropdown trigger="click">
            <span class="el-dropdown-link">
                <i class="el-icon-more"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
                <el-dropdown-item><i class="my-icon icon-folder"></i><span>创建文件夹</span></el-dropdown-item>
                <el-dropdown-item><i class="my-icon icon-document"></i><span>创建文档</span></el-dropdown-item>
                <el-dropdown-item><i class="my-icon icon-markdown"></i><span>创建Markdown</span></el-dropdown-item>
                <el-dropdown-item><i class="my-icon icon-edit"></i><span>编辑</span></el-dropdown-item>
               <el-dropdown-item><i class="my-icon icon-delete"></i><span>删除</span></el-dropdown-item>
            </el-dropdown-menu>
        </el-dropdown>
    </div>
</el-tree>

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.

参考：

 ElementUI dropdown 触发显示时阻止事件冒泡

原创作者: u_12881709 转载于: https://blog.51cto.com/u_12881709/11835900