Javascript 基于state.vallue值隐藏/取消隐藏操作图标

如果

物料表

中的

数据状态

等于

已批准

，我想隐藏

已批准/未批准

按钮

const [data, setData] = useState([
{ID: 1, STATUS: "APPROVED"},
{ID: 2, STATUS: "FOR APPROVAL"},
{ID: 3, STATUS: "REJECTED"},
]);

<MaterialTable 
                icons={tableIcons}
                columns={columns}
                data={data}
                title="List of Advisory"
                style={{
                    overflowX: 'auto'
                }}
actions={[
 {
                        icon: tableIcons.Edit,
                        tooltip: 'Edit Advisory',
                        onClick: (event, rowData) => selectedAdvisory(rowData, 'Edit')
                    },
{
                icon: tableIcons.Delete,
                tooltip: 'Delete Advisory',
                onClick: (event, rowData) => selectedAdvisory(rowData, 'Delete')
              },
                    {
                        icon: tableIcons.ThumbsUpDownIcon,
                        tooltip: 'Approved/Disapproved Advisory',
                        onClick: (event, rowData) => selectedAdvisory(rowData, 'ApproveDisapprove')
                    },

{
                icon: tableIcons.PageviewIcon,
                tooltip: 'Preview',
                onClick: (event, rowData) => alert('You are about to view' + rowData.ADVISORYID)
              }

]}
                localization={{
                    header:{actions:'Actions'}
                }}
            />

const[data，setData]=useState([
{ID:1，状态：“已批准”}，
{ID:2，状态：“待批准”}，
{ID:3，状态：“已拒绝”}，
]);
已选择的dvisory（行数据“编辑”）
},
{
图标：表格图标。删除，
工具提示：“删除建议”，
onClick：（event，rowData）=>selectedAdvisory（rowData，“Delete”）
},
{
图标：tableIcons.ThumbUpDownIcon，
工具提示：“已批准/未批准的建议”，
onClick：（事件，rowData）=>selectedAdvisory（rowData，'ApproveDisapprove'）
},
{
图标：tableIcons.PageviewIcon，
工具提示：“预览”，
onClick：（event，rowData）=>alert（'您将要查看'+rowData.ADVISORYID）
}
]}
本地化={{
标题：{actions:'actions'}
}}
/>

如果

状态

为

已批准

，我想隐藏操作列上的

已批准/未批准

图标。 先谢谢你

材料界面： 材料表：

---

在columns属性中添加/放置操作图标/按钮

{ title: 'Actions', sorting: false, render: rowData =>
<Link to={`#`}
onClick={dosomething}
style={{display: rowData.state==='approved' ? 'none' : 'block'}}
onClick={dosomething}
<Approveicon>
</Link> }

{title:'Actions'，排序：false，呈现：rowData=>
请使用MaterialTable组件中的columns属性。然后您可以根据rowdata=>值管理每个图标。