Bei Verwendung der von Ihnen erstellten <Tab/>-Komponente liegt ein Problem mit dem Status „&.Mui-selected' vor
P粉775788723
P粉775788723 2023-09-20 19:56:31
0
1
544

Ich habe ein benutzerdefiniertes <Tab/> erstellt und möchte dessen Auswahlfarbe mithilfe des folgenden Codes steuern:

Sandbox-Democode

export const Tab = styled(MuiTab)({
  "&.Mui-selected": {
    color: "red"
  }
});

Allerdings habe ich Folgendes entdeckt:

1. Benutzerdefinierte Stilkomponenten direkt anwenden => Wählen Sie die Farbe Rot aus

2.Das Einschließen einer benutzerdefinierten gestalteten Komponentein eine selbst erstellte Komponente => funktioniert nicht, nicht einmal eine standardmäßig ausgewählte Farbe

<Tabs value={value} variant="scrollable">
  <Tab label="Tab" value={1} /> //选中颜色 = 默认值
  <TestTab label="TestTab" value={2} /> //选中颜色 = 默认值(问题在这里)
  <Styled.Tab label="Styled.Tab" value={3} /> //选中颜色 = 红色(好的,但我想包装在自创建的组件中)
</Tabs>

Ist das normale Verhalten von MUI, selbst erstellte Tabs nicht zu erkennen?

P粉775788723
P粉775788723

Antworte allen(1)
P粉946336138

如何创建一个包装组件,以这种方式渲染您自定义的 Tab 组件 TestTab,而不是使用 Styled.Tab

const TestTab = (props) => {
  return <Tab {...props} />;
};
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage