CODEWITHSUNDEEP
reactjsantd
Angi
Angi

Reputation: 105

How to hide a certain column of a table using antd?

Sample code below

{
title: 'Site', 
dataIndex: 'site'
}

I want to hide the site column and im still new to the antd react ui. And theres no show/hide function in column API of antd docs. I want to hide it after a certain condition has been met like there are 2 user types. Admin user and General user.

if(user_role = admin_user){
show column
elseif(user_role = general_user){
hide column
}

Upvotes: 0

Views: 436

Answers (1)

umair
umair

Reputation: 534

   getColumns = (userRole) => {
        switch(userRole){
          case 'AdminUser': { return  //return admin user columns here }
          case 'GeneralUser': { return //return the genral user columns here }
          default: { return //handle other cases.. or raise error}

      }
}

In your table component call the function.(Assuming your state has the user role)

<Table columns = {this.getColumns(this.state.userRole)} />

Upvotes: 1

Related Questions