Eltable根本没有loading属性
时间: 2023-10-08 08:08:41 浏览: 66
基于Vue和ElementUI的ElTable和ElPagination深度封装设计源码
非常抱歉,我犯了错误。`el-table` 组件没有 `loading` 属性。如果要为 `el-table` 添加 loading 效果,可以使用 `el-loading` 组件来实现。
以下是一个示例代码:
```html
<template>
<div>
<el-table :data="tableData" ref="tableRef"></el-table>
<el-loading v-if="tableLoading" :text="loadingText" background="rgba(0, 0, 0, 0.8)" target=".el-table__body-wrapper"></el-loading>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [],
tableLoading: false,
loadingText: '数据加载中'
}
},
methods: {
fetchData() {
this.tableLoading = true
// 异步请求数据
// 请求完成后将 tableLoading 置为 false
}
},
mounted() {
this.fetchData()
}
}
</script>
```
在上面的代码中,使用 `el-loading` 组件来实现 loading 效果。将 `el-table` 的 `ref` 属性设置为 `tableRef`,然后在 `el-loading` 上使用 `target` 属性将 loading 效果绑定到 `el-table__body-wrapper` 元素上。在 `fetchData` 方法中,将 `tableLoading` 设置为 `true`,然后进行异步请求数据,在请求完成后将 `tableLoading` 置为 `false`,这样就能够在 `el-table` 上显示 loading 效果了。
阅读全文