React Material, have different colors in Label attribute for Material Tabs-CodePudding

I am using Material Tabs, and want the label to have a different colors within. I want Product Information to be black (regular text) and the asterisk to be red. How can this be done in label?

<Tabs
    value={this.state.tabIndex}
    onChange={this.handleTabChange}
>
    <Tab label="Visit Information" />
    <Tab
       label={`Product Information ${this.state?.productFlag ? '*' : ''}`}
    />

CodePudding user response：

As this doc says, you can use a node (element) for label prop in Tab component. So, try this:

<Tab
  label={<span>Product Information <span style={{color: 'red'}}>{this.state.productFlag ? '*' : ''}</span></span>}
/>