根据特定条件在列表中加一列操作，符合此条件时此列才会展示

最新推荐文章于 2024-06-14 15:02:13 发布

是芊芊吖

最新推荐文章于 2024-06-14 15:02:13 发布

阅读量128

点赞数 1

分类专栏：项目技能文章标签： javascript 开发语言前端 react.js

本文链接：https://blog.csdn.net/Xiu_Xiu_cdx/article/details/138789596

版权

项目技能专栏收录该内容

28 篇文章 0 订阅

订阅专栏

我们想要列表中有一列数据在A环境打开是显示的，在B环境打开则不显示，这里B环境表示为默认环境

1、不能直接用环境判断加在列表的前面，否则其他环境会出现空格情况

constructor(props) {
  super(props)
  const columns = [
    { title: '姓名', dataIndex: 'name', width: 80, sortable: true, cell: v => <Tip title={v} /> },
     ++A && { title: '类型', dataIndex: 'type', width: 120, sortable: true, cell: v => <Tip title={v} /> },
  ]
}

在这里插入图片描述

2、正确的方法应该是根据环境变量插入一列项

constructor(props) {
  super(props)
  const columns = [
    { title: '姓名', dataIndex: 'name', width: 80, sortable: true, cell: v => <Tip title={v} /> },
  ]
  ++this.columns = this.setCustomColumns(columns)
}

/** 设置特殊展示列 */
setCustomColumns = (columns) => {
  if (A) {
    const Columns = [].concat(columns);
    Columns?.splice(1, 0, { title: '类型', dataIndex: 'type', width: 120, sortable: true, cell: v => <Tip title={v} /> })
    return Columns;
  }
  return columns;
}