展开
拓展 关闭
订阅号推广码
GitHub
视频
公告栏 关闭

element ui获取表格某一行的id

<template>
    <div>
       <el-table
            class = "table"
            :data="BlogList"
            style="width: 100%"
            :row-class-name="tableRowClassName"
            border
            stript
        >
            <el-table-column type="index" label="#" />
            <el-table-column prop="id" label="id" width="100" />
            <el-table-column prop="uid" label="用户id" width="120" />
            <el-table-column :show-overflow-tooltip="true" prop="title" label="标题" width="120" />
            <el-table-column :show-overflow-tooltip="true" prop="mdContent" label="md" width="250" />
            <el-table-column :show-overflow-tooltip="true" prop="htmlContent" label="html" width="80" />
            <el-table-column :show-overflow-tooltip="true" prop="publishDate" label="发布时间" width="80" />
            <el-table-column prop="editTime" label="修改时间" width="180" />
            <el-table-column prop="states" label="状态" width="180" />
            <el-table-column label="操作" width="300">
                <!-- <el-tooltip
                    class="item"
                    effect="dark"
                    content="修改用户信息"
                    placement="top-start"
                    :enterable="false"
                >
                    <el-button type="primary" :icon="Edit" size="mini">修改</el-button>
                </el-tooltip>
                <el-button type="primary" :icon="Share" size="mini">删除</el-button>
                <el-button type="primary" :icon="Delete" size="mini">设置</el-button> -->

                <template #default="scope">
                    <el-button type="text" @click="Look(scope.row.id)">查看</el-button>
                    <el-button type="text" @click="UpdateBlog(scope.row.id)">修改</el-button>
                    <el-button type="text" @click="delBlog(scope.row.id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script lang = "ts" scoped>
export default {
    data() {
        return {
            BlogList: []
        }
    },
    methods: {
        async getUserList(){
            const {data: res} = await this.$http.post("articlemanagement/getAll")
            console.log(res)
            this.BlogList =  res.data;
        },
        Look(id){
            console.log("" + id)
            window.sessionStorage.setItem('blog_id', id)
            this.$router.push('/blogDetails')
        },
        UpdateBlog(id){
            window.sessionStorage.setItem('update_blog', id)
            this.$router.push('/updateBlog')
        },
        delBlog(id){
            const reqData = {    
                id: id
            } 
            this.$http.post("article/deleteOne", reqData).then((response)=>{
                if(response.data.code == 200 ) {
                alert("删除成功!")
                }else {
                alert("删除失败!!")
                }
            }).catch(error=>{console.error(error)});
        }
    },
    created(){
        this.getUserList();
    }
}
</script>

<style lang = "less" scoped>
</style>
posted @ 2022-07-22 14:42  DogLeftover  阅读(110)  评论(0)    收藏  举报