vue+elementUI给table里的每一个按钮设置loading

2020-05-14

阅读 1 分钟

1589438641(1).jpg

<el-button type="primary" size="medium":disabled="scope.row.garage.status !== 20" @click="selectGarageLogin(scope.row)" :loading="scope.row.loading">登录</el-button>

开始发现loading值改变了，视图是没更新的。

官方解释对于已经创建的实例，Vue 不允许动态添加根级别的响应式 property。但是，可以使用Vue.set(object, propertyName, value)方法向嵌套对象添加响应式 property

解决思路：重新处理一下数据，初始为每条数据添加loading属性

    this.sign_list = res.data.sign_list.map(item => {
        this.$set(item, loading, false)
        item.loading = false //(或者)
        return item
    })

1589448196(1).jpg