在el-table外部获取el-table中的值
时间: 2023-12-01 10:40:35 浏览: 100
vue3 el-table多级表头收缩扩展的实现(JS原味版)
可以通过ref属性获取el-table的实例,然后通过实例的方法获取表格中的数据。具体步骤如下:
1. 在el-table上添加ref属性,例如ref="table"。
2. 在需要获取表格数据的方法中,使用this.$refs.table获取el-table的实例。
3. 通过实例的方法getTableData()获取表格中的数据。
以下是一个示例代码:
```html
<template>
<div>
<el-table ref="table" :data="tableData">
<!-- 表格列定义 -->
</el-table>
<el-button @click="getData">获取表格数据</el-button>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [
// 表格数据
]
}
},
methods: {
getData() {
const tableInstance = this.$refs.table
const tableData = tableInstance.getTableData()
console.log(tableData)
}
}
}
</script>
```
阅读全文