React中如何根据条件控制MUI Tab的ErrorIcon显示？

直接通过条件渲染就能实现需求，把Tab的icon属性改成基于contextStatus的判断逻辑即可：

<Tab
  icon={!contextStatus ? <ErrorIcon /> : null}
  iconPosition="end"
  label="Acquisition"
  {...a11yProps(1)}
/>

逻辑说明： #

• 用三元运算符判断：当contextStatus为false时（!contextStatus为真），渲染<ErrorIcon />；
• 当contextStatus为true时，给icon传null，就不会显示任何图标。

如果是多个Tab各有独立的状态（比如每个Tab对应一个xxxStatus），只需要把判断条件换成对应Tab的状态变量就行。

内容的提问来源于stack exchange，提问作者Sandeep Thomas