zoukankan      html  css  js  c++  java
  • vue ant popconfirm 阻止事件冒泡

    这段代码表格有行点击事件,行中有三个a标签,分别有点击事件,目标是点击行中的a标签时,不触发行的点击事件。
                    <a-table
                        ref="table"
                        size="middle"
                        bordered
                        rowKey="id"
                        :columns="columns"
                        :dataSource="dataSource"
                        :pagination="ipagination"
                        :loading="loading"
                        :customRow="rowClick"
                        @change="handleTableChange">
    
                        <span slot="action" slot-scope="text, record">
                            <a @click="handlePreview(record)">查看</a>
                            <a-divider type="vertical" v-show="uploader"/>
                            <a-popconfirm v-show="uploader" title="确定删除吗?" @confirm="(e) => handleDelete(record.id)">
                                <a>删除</a>
                            </a-popconfirm>
                            <a-divider type="vertical"/>
                          <a @click="handleDonwload(record)">下载</a>
                        </span>
                    </a-table>

    实现方式:

      <span slot="action" slot-scope="text, record">
                            <a @click.stop="handlePreview(record)">查看</a>
                            <a-divider type="vertical" v-show="uploader"/>
                            <a-popconfirm v-show="uploader" title="确定删除吗?" @confirm="(e) => handleDelete(record.id)">
                                <a @click.stop>删除</a>
                            </a-popconfirm>
                            <a-divider type="vertical"/>
                          <a @click.stop="handleDonwload(record)">下载</a>
                        </span>

    特别是 popconfirm 控件,需要控件在  <a @click.stop>删除</a>  中

  • 相关阅读:
    Sharepoint 文档库根据文件夹层级展示
    SQL数据库修改默认备份和恢复路径
    利用Ajax增删改Sharepoint List Item
    Excel数据导入到Sharepoint List
    使用powershell部署WSP包
    高阶组件
    ui组件库
    2019面试题总结
    项目上线步骤及注意事项
    git使用
  • 原文地址:https://www.cnblogs.com/chensuqian/p/14300557.html
Copyright © 2011-2022 走看看