本文介绍了如何使用 Vue 和 Element-UI 库动态展示表格列表。通过将列名存储在 `columns` 数组中并动态改变其内容，可以实现表格列的动态显示。具体实现代码包括向 `columns` 推送包含 `label`、`value` 和唯一 `key` 的对象，并提供了一个获取数据并填充 `gridData` 的方法。
思路：
把列名都放在columns这个数组中，动态改变这个数组的内容，就能实现动态展示列的目的，代码如下：
columns数组包含的内容格式如下：
// 字段header
this.columns.push({
label: 实际的字段名，比如id,
value: 实际的字段名，比如id,
key: Date.now()
});
代码全部如下：
关 闭
// 获取样本数据的请求
import {
getSampleDataUrl
} from '@/api/task/tasklist';
export default {
name: 'showDataSample',
props: ['visible'],// 父组件传来的可变量，用户控制 el-dialog的显示于隐藏
data() {
return {
columns: [],// 列名，如 id,name
gridData: [] // 结果, 如 1001，张三
};
},
created() {
console.log("in showDataSample ");
},
methods: {
cancelModal() {
// 关闭弹窗，触发父组件
最低0.47元/天 解锁文章
2017
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
