el-table如何动态增加列

el-table如何动态添加列:

  1. 将数据从列表中抛出来直接放到对象中:

    复制代码
         data.forEach(el => {
           el.shipList.forEach(item => {
             el[item.FieldTag] = item.DateTimeValue;
           });
         });
  2. 网页:

planFormList是列表内容,循环出来当做表头。

复制代码
       <el-table-column
          v-for="item in planFormList"
          :prop="item.FieldTag"
          :label="item.FieldName"
          :key="item.FieldTag"
        >
          <template v-slot="{ row }">
            <el-date-picker
              v-model="row[item.FieldTag]"
              v-if="editCan"
              type="date"
              placeholder=""
              size="small"
            />
            <span v-else>{{ row[item.FieldTag] }}</span>
          </template>
        </el-table-column>
相关推荐
用户66006766853912 小时前
模板字符串 + map:用现代 JavaScript 高效构建动态 HTML
前端·javascript
AY呀12 小时前
《玩转Vue3响应式:手把手实现TodoList,掌握核心指令》
前端·javascript·vue.js
哆啦A梦158812 小时前
商城后台管理系统 07 商品列表-分页实现
前端·javascript·vue.js
爱因斯坦乐12 小时前
【若依】前后端分离添加导入
java·前端·javascript
答案answer12 小时前
Vue3项目集成monaco-editor实现浏览器IDE代码编辑功能
前端·vue.js
绝世唐门三哥13 小时前
Vue 自定义指令完全指南(含 Vue2/Vue3 对比 + 完整 Demo)
前端·javascript·vue.js
Asurplus13 小时前
【VUE】15、安装包管理工具yarn
前端·vue.js·npm·node.js·yarn
马卫斌 前端工程师13 小时前
vue 多个请求要同时拉取数据,写一个方法
前端·javascript·vue.js
写代码的皮筏艇13 小时前
react hooks中的useState
前端·javascript
启山智软13 小时前
【单体系统与分布式系统是两种根本不同的软件架构模式】
java·vue.js·spring boot·后端·spring