zoukankan      html  css  js  c++  java
  • elment-ui中 给table表格 某项加点击事件

    情况一:前端写表格

    代码:

    <template>
    <el-table-column
    header-align="center"
    align="center"
    label="单据编号"
    prop="statementBaseNo"
    >
    <template slot-scope="scope">
    <el-button type="text" @click="statementBaseNoJump(scope.row)">{{scope.row.statementBaseNo}}</el-button>
    </template>
    </el-table-column>
    </template>

    <script>
    //点击跳转页面

    statementBaseNoJump(row) {
            this.$router.push({
    path: "/checkBillStatementSaleManageDetail",
    query: { refreshtarget: true, id: row.extId,billCheckType: row.billCheckType,ids: this.$route.query.id}
    });
    }
    </script>

    情况二:后端写表格

    <el-table-column
    v-for="(col, index) in localShowTableCols"
    :key="index + col.name"
    :fixed="col.fixable"
    :prop="col.name"
    :label="col.title"
    :min-width="col.columnWidth"
    show-overflow-tooltip
    header-align="center"
    align="center"
    >
    <template slot-scope="scope">
    <el-button
    v-if="col.name === 'statementBaseNo'"
    @click="returnDetail(scope)"
    type="text"
    size="small"
    v-auth="4"
    >
    {{ scope.row[col.name] }}
    </el-button>
    <span v-else>{{ getValue(scope.row, col.name) }}</span>
    </template>
    </el-table-column>


    补充:localShowTableCols为动态列数据
    statementBaseNo为单据编号
    returnDetail为点击事件




  • 相关阅读:
    sublime使用技巧
    周末时间学习Linux
    中小企业网络安全提升
    NoSQL是什么?
    IBM的淘汰之路
    Linux 中断处理浅析
    深入理解 C 语言的函数调用过程
    LAMP简易安装
    安装Fedora 24后必要的设置
    wget命令详解
  • 原文地址:https://www.cnblogs.com/dandanyajin/p/13551952.html
Copyright © 2011-2022 走看看