element ui的table表格如果想给一行中的某一列添加不同的操作可以这样做

方法1：

代码：

            <el-table-column
                    label="知识点"
                    prop="description"
                    show-overflow-tooltip>
                <template slot-scope="scope">
                    <router-link v-bind:to="'/index?id='+scope.row.id">                           
                        {{scope.row.description}}
                    </router-link>
                </template>
            </el-table-column>

如果想控制某一个元素。可以使用事件添加判断

感觉上面的方法不好用。我想了另一个办法：

方法2：
1，在click里面关联一个isClick默认是false，如果点击了。就变成true。
2，在点击每一行之后。要跳转之前。加一个判断。isClick为true就不跳转。

关键代码：

完整代码：

<template>
    <div>
        <h3>我创建的试卷列表：包含了所有做过和没有做过的试卷MyExam</h3>
        <el-table
                :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
                style="width: 100%" @cell-click="handle">
            <el-table-column
                    label="序号"
                    prop="id">
            </el-table-column>
            <el-table-column
                    label="试卷名称"
                    prop="name">
            </el-table-column>
            <el-table-column
                    label="试卷描述"
                    prop="description">
            </el-table-column>
            <el-table-column
                    label="试卷标签"
                    prop="categories">
            </el-table-column>
            <el-table-column
                    label="题目数量"
                    prop="topicCount">
            </el-table-column>
            <el-table-column
                    label="总分"
                    prop="score">
            </el-table-column>
            <el-table-column
                    label="考试时长"
                    prop="time">
            </el-table-column>
            <el-table-column
                    label="创建时间"
                    prop="createTime">
            </el-table-column>
            <el-table-column
                    align="right">
                <!--                    <template slot="header" slot-scope="scope">-->
                <template slot="header">
                    <el-input
                            v-model="search"
                            size="mini"
                            placeholder="输入关键字搜索"/>
                </template>
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            @click="beginTest(scope.$index, scope.row)">开始考试
                    </el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            @click="handleDelete(scope.$index, scope.row)">删除试卷
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pageNum"
                    background
                    layout="prev, pager, next"
                    :total="total">
        </el-pagination>
    </div>
</template>

<script>
    import global from "../../Global";

    export default {
        name: "MyExam",
        data() {
            return {
                tableData: [
                    {
                        id: '',//试卷id序号
                        name: '',//试卷名称
                        creatorId: '',//创建者id
                        description: '',//试卷描述
                        categories: [],//标签
                        topicCount: 0,//题目数量
                        score: 0,//总分
                        time: 0,//考试时长
                        createTime: '',//创建时间
                    }
                ],
                isClick: false,  //判断按钮是否被点击
                search: '',
                pageNum: 1,
                pageSize: 10,
                total: 0,
            }
        },
        methods: {
            //点击每一行都可以跳转
            handle(row, column, event, cell) {
                console.log(row)
                console.log(column)
                console.log(event)
                console.log(cell)
                // 跳转到编辑题目页面需要的数据id
                console.log("试卷编号是：" + row.id);
                console.log("试卷创建者是：" + row.creatorId);
                localStorage.setItem("examId", row.id);
                localStorage.setItem("examCreatorId", row.creatorId);
                if (!this.isClick) {
                    this.$router.push({path: '/examdetails'});
                }
            },
            beginTest(index, row) {
                this.isClick = true;
                console.log(index, row);
                console.log(row.id);
                this.$router.push({
                    path: '/createtest',
                    query: {
                        id: row.id
                    }
                });
            },
            //删除试卷
            handleDelete(index, row) {
                console.log(index, row);
                console.log(row.id);
                console.log(typeof row.id);
                this.isClick = true;
                console.log("是否被点击了删除按钮试卷？==" + this.isClick);
                this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let formdata = new FormData();
                    formdata.append('id', row.id);
                    this.$axios.post("/exam/deleteExam", formdata).then(response => {
                        console.log("response.data" + response.data);
                        if (response.data.status === global.responseCode.OK) {
                            console.log("删除成功！");
                            //删除成功之后。页面重新获取数据
                            this.getData();
                            this.isClick = false;
                        } else {
                            console.log("删除失败： " + response.data.msg);
                        }
                    }).catch(function (error) {
                        console.log(error);
                    });
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                }).catch(() => {
                    this.isClick = false;
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            //分页
            // 每页显示的条数
            handleSizeChange: function (size) {
                // 改变每页显示的条数
                this.pagesize = size;
                console.log(this.pagesize);
            },
            // 显示第几页
            handleCurrentChange: function (pageNum) {
                // 改变默认的页数
                this.pageNum = pageNum;
                console.log(this.pageNum); //点击第几页
                this.getData();
            },
            getData() {
                this.$axios.get("/exam/listMyExam", {params: {pageNum: this.pageNum}}).then(response => {
                    // console.log(response.data.result);
                    if (response.data.result) {
                        // this.tableData = response.data.result;
                        var arr = response.data.result.list;
                        this.tableData = arr.map(item => {
                            return {
                                id: item.id,
                                name: item.name,
                                creatorId: item.creatorId,
                                description: item.description,
                                topicCount: item.topicCount,
                                score: item.score,
                                time: item.time,
                                categories: item.categories,
                                createTime: item.createTime,
                            };
                        });
                        this.total = response.data.result.total;
                        // console.log(this.total);
                    } else {
                        console.log("获取试卷信息失败： " + response.data.msg);
                    }
                }).catch(function (error) {
                    console.log(error);
                })
            },
        },
        created() {
            this.getData();
        }
    }
</script>

<style scoped>

</style>

https://segmentfault.com/q/1010000021853272