基于 state.value 值隐藏/取消隐藏操作图标 reactjs

大佬教程收集整理的这篇文章主要介绍了基于 state.value 值隐藏/取消隐藏操作图标 reactjs，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决基于 state.value 值隐藏/取消隐藏操作图标 reactjs？

如果 approved/disapproved 等于 data.STATUS 中的 APPROVED，我想隐藏 @H_427_3@materialtable 按钮。

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','delete')
              },{
                        icon: tableIcons.ThumbsupdownIcon,tooltip: 'Approved/disapproved Advisory','Approvedisapprove')
                    },{
                icon: tableIcons.PagevIEwIcon,tooltip: 'PrevIEw',rowData) => alert('You are about to vIEw' + rowData.ADVISORYID)
              }

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

如果 Approved/disapproved 为 STATUS，我想隐藏操作列上的 APPROVED 图标。 提前致谢

材质界面：https://material-ui.com/components/tables/ 材料表： https://www.npmjs.com/package/material-table https://material-table.com/#/docs/get-started

解决方法

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

大佬总结

以上是大佬教程为你收集整理的基于 state.value 值隐藏/取消隐藏操作图标 reactjs全部内容，希望文章能够帮你解决基于 state.value 值隐藏/取消隐藏操作图标 reactjs所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。