我創建了一個自訂的<Tab/>
,我想透過使用以下程式碼來控制它的選取顏色:
沙盒示範程式碼
export const Tab = styled(MuiTab)({ "&.Mui-selected": { color: "red" } });
然而,我發現:
1.直接套用自訂樣式的元件 => 選取顏色為紅色
2.將自訂樣式的元件包裝在一個自建立的元件中 => 不起作用,甚至沒有預設的選取顏色
<Tabs value={value} variant="scrollable"> <Tab label="Tab" value={1} /> //选中颜色 = 默认值 <TestTab label="TestTab" value={2} /> //选中颜色 = 默认值(问题在这里) <Styled.Tab label="Styled.Tab" value={3} /> //选中颜色 = 红色(好的,但我想包装在自创建的组件中) </Tabs>
這是MUI不辨識自創建的Tab的正常行為嗎?
如何建立一個包裝元件,以這種方式渲染您自訂的 Tab 元件
#TestTab
,而不是使用Styled.Tab