el表格头部拼装，filter+map的结合使用

一、场景

像navicat查数据一样，select * from user;这样的数据，但因为是业务涉及修改数据表元数据，所以需要过滤离线的数据表元数据，然后保留在线表的字段拼接到列上。

二、代码

• 先过滤筛选出id为null（即在线）的字段，然后拿到它的字段名，最后拼接（ELM-UI）el-table所需的columns

if(res.list.length === 0) {
              // 无数据时初始化头部列，过滤离线字段
              const arr = this.columnsList.filter(item => !item.id).map(e => {
                  return e.columnsCode
              })
              const columns = [{ type: 'index', prop: 'index', width: 80, label: '序号', align: 'center' }]
              arr.forEach(e => {
                columns.push({ label: e, prop: e, width: 120 })
              });
              this.columns = columns
              return false
            }

最后

就这样，随手记录一个写法\(^o^)/~