如何更新整个el-table数据
时间: 2023-10-18 13:17:53 浏览: 161
VUE element-ui 写个复用Table组件的示例代码
如果你想要更新整个 `el-table` 的数据,可以直接修改数据源中的数据,然后调用 `el-table` 的 `$forceUpdate()` 方法,强制重新渲染视图。
例如,假设你有一个表格,数据源为 `tableData` 数组,你想要更新整个表格的数据,可以这样做:
```javascript
// 修改 tableData 数组中的数据
this.tableData = [
{ name: '张三', age: 20 },
{ name: '李四', age: 22 },
{ name: '王五', age: 25 },
];
// 调用 $forceUpdate() 方法,强制重新渲染视图
this.$refs.table.$forceUpdate();
```
在上面的代码中,我们先修改了 `tableData` 数组中的数据,然后调用了 `$forceUpdate()` 方法,强制重新渲染视图。这样,整个表格的数据就会更新了。
需要注意的是,如果你直接修改了 `tableData` 数组中的某一项数据,而没有修改整个数组,视图是不会自动更新的。这时你需要使用 `$set` 方法来更新数据,或者使用 `splice` 方法替换整个数组。
阅读全文