Hide column for table using antd

If you already have the code generating your columns, a much simpler option than implementing a custom render method to hide a column is simply to filter it out of your completed columns list, e.g.:

let columns = [
  {
    title: "Id",
    dataIndex: "id",
    key: "id"
  },
  {
    title: "Name",
    dataIndex: "name",
    key: "name"
  },
  {
    title: "Address",
    dataIndex: "address",
    key: "address"
  }
];

return columns.filter(col => col.dataIndex !== 'id');

Here is how I did it. The concept is the same, which is to remove (filter out) the column from the array.

Add a property "hidden" to the column object, then filter it out.

let columns = [
  {
    title: "Name",
    dataIndex: "name",
    key: "name"
  },
  {
    title: "Age",
    dataIndex: "age",
    key: "age"
  },
  {
    title: "Address",
    dataIndex: "address",
    key: "address"
  },
  {
    title: "Action",
    key: "action",
    dataIndex: "action",
    hidden: true
  }
].filter(item => !item.hidden);