将txt文本的数据读到element ui 表格中,文本有39行18列,每一行以空格隔开
时间: 2024-02-09 20:10:15 浏览: 77
你可以按照以下步骤实现:
1. 使用`axios`库获取`txt`文件的内容。
2. 将内容按行分割,得到一个包含每行数据的数组。
3. 对于每一行数据,使用`split`方法按空格分割,得到一个包含每个单元格数据的数组。
4. 将每行的数据组成一个对象,并添加到一个数组中。
5. 将数组作为`element-ui`表格的数据源。
下面是一个示例代码:
```
<template>
<el-table :data="tableData">
<el-table-column prop="col1" label="列1"></el-table-column>
<el-table-column prop="col2" label="列2"></el-table-column>
<!-- 添加其它列 -->
</el-table>
</template>
<script>
import axios from 'axios';
export default {
data() {
return {
tableData: []
};
},
mounted() {
axios.get('data.txt').then(response => {
const lines = response.data.split('\n');
const data = lines.map(line => {
const cells = line.trim().split(/\s+/);
return {
col1: cells[0],
col2: cells[1],
// 添加其它列
};
});
this.tableData = data;
});
}
};
</script>
```
这里假设`data.txt`文件在当前目录下。你需要根据实际情况修改文件名和列名。
阅读全文