element-ui给table里的每个按钮设置loading

说明：在table中，点击不同行的操作按钮，只有此行的按钮进行加载，请求后台成功后停止加载。

具体看代码（只有前端代码）：

<template>
    <el-table :data="userList" border fit class="user_table">
        <el-table-column label="姓名" prop="username" align="center"></el-table-column>
        <el-table-column label="电话" prop="phone" align="center"></el-table-column>
        <el-table-column label="操 作" align="center">
            <template slot-scope="scope">
                <el-button type="text" :loading="scope.row.loading" @click="edit(scope)">编辑
                </el-button>
            </template>
        </el-table-column>
    </el-table>
</template>

<script>
    export default {
        data() {
            return {
                userList: []
            }
        },
        created() {
            this.getList()
        },
        methods: {
            //查询用户列表
            getList() {
                user.getList().then(res => {
                    this.userList = res.data
                    this.userList.map(item => {
                        //添加属性，设置默认值
                        this.$set(item, 'loading', false)
                        return item
                    })
                }, err => {
                    console.log(err)
                })
            },
            //编辑查询用户
            edit({row}) {
                row.loading = true
                user.select({
                    id: row.id
                }).then(res => {
                    if (res.code == 200) {
                        row.loading = false
                    }
                }, err => {
                    console.log(err)
                })
            }
        },

    }

</script>