我正在動(dòng)態(tài)使用此選項(xiàng)卡: <Tabs value={value} onChange={handleChange} variant="scrollable" scrollButtons="off" indicatorColor="primary" textColor="primary" aria-label="scrollable" classes={{ indicator: classes.indicator, flexContainer: classes.flexContainer, }} > {routes.map((value, index) => ( <Tab classes={{ root: classes.tabRoot, wrapper: classes.wrapper, labelIcon: classes.labelIcon, selected: classes.selected, }} key={index} label={strings(value)} icon={getIcon(value)} {...a11yProps(index)} /> ))} {<Grid container> <Grid item xs> <PrintButton type= "widget" params={queryParams} style={{ textTransform: "capitalize", float: "right" }} /> </Grid> </Grid>} </Tabs>這是 getIcon 函數(shù):const getIcon = (value) => { if (value === eventType.view) return <PageviewIcon />; if (value === eventType.lead) return <ContactsIcon />; if (value === eventType.share) return <ShareIcon />; if (value === eventType.follow) return <GroupAddIcon />; if (value === eventType.media) return <PermMediaIcon />; if (value === eventType.print) return <FindInPageIcon />; return null;};每個(gè)選項(xiàng)卡都是這樣看的:我正在嘗試用一些填充來分隔標(biāo)簽中的圖標(biāo),如下所示:但是我無法找到一種方法來替換這個(gè)類MuiTab-labelIcon .MuiTab-wrapper ,默認(rèn)情況下它是這樣的:在更新到 Material UI v4 之前我沒有遇到這個(gè)問題我嘗試在圖標(biāo)上使用內(nèi)聯(lián)樣式,但導(dǎo)致圖標(biāo)非常小<ShareIcon style={{paddingBottom: '0px', paddingRight: "10px"}}/>我將不勝感激任何幫助,在此先感謝!
Material UI - 選項(xiàng)卡圖標(biāo)樣式
海綿寶寶撒
2023-05-25 17:33:53