How to place an closing button on a tab, using Material UI

user_8036670 0
Viewed 2474

I am creating dynamics tabs using ReactJS and Material UI, but I wonder how to place a functional closing tab button directly on the tab.

I mean this:

enter image description here

And by the way, is there any way to place the icon side by side with the text?

material-ui reactjs
1 Answers

I tried this and it worked for me:

<Tabs
        value={value}
        onChange={handleChange}
      >
        <Tab label={
          <span>
                    {'Active'}
                    <IconButton size="small" onClick={() => { handle() }}>
                      <CloseIcon />
                    </IconButton>
                  </span>
        } />
        <Tab label="Disabled" disabled />
        <Tab label="Active" />
      </Tabs>
user_80366700
Related