我刚刚开始使用 Material UI 版本 5。最初为了使用我的自定义主题样式，我会使用 makestyles，但似乎在 v.5 中不起作用。我的主题位于其自己的组件上，为了导入这些主题，我使用{createTheme}而不是旧的{createMuiTheme}. 我像往常一样将主题导入到父组件中，并将其设置为<ThemeProvider theme{theme}></ThemeProvider>.
现在，在我的另一个组件上，我再次尝试使用 useStyles，但它不起作用，因为它没有在版本 5 中使用。我很难弄清楚如何转换它，以便它可以在版本 5。以下是我正在编写的一些未完成的代码：
const useStyles = makeStyles((theme) => ({
logo: {
height: "8em",
marginLeft: "0.2em",
},
tabContainer: {
marginLeft: "auto",
},
tab: {
...theme.typography.tab,
minWidth: 10,
marginRight: "50px",
opacity: 1,
"&hover": {
color: theme.palette.common.purple,
textDecoration:"none",
},
},
}));
export default function Navigation(props) {
const classes = useStyles();
const [value, setValue] = useState(0);
const handleChange = (e, value) => {
setValue(value);
};
const …我正在学习如何使用 DOM。我试图使用 .forEach（或 for 循环，但更喜欢 .forEach）和一个 querySelectorAll("a") 来循环遍历每个锚点并更改它在锚点中的内容。就像我希望第一个锚点被称为服务，第二个锚点被称为服务，等等......我一直在做的是这样的事情，它不是 .forEach 或 for 循环：
let navItems = document.querySelectorAll("a")
navItems[0].textContent = "Services"
navItems[1].textContent = "Product"
navItems[2].textContent = "Vision"
navItems[3].textContent = "Features"
navItems[4].textContent = "About"
navItems[5].textContent = "Contact"这做我想要的，但是我只想使用 .forEach 尝试循环浏览每个导航项目以更改每个项目的名称，但我很难找到方法。我知道有很多不同的方法可以做到这一点，但我特别希望通过 .forEach 甚至只是一个常规的 for 循环来做到这一点。我正在尝试操作此代码中的 HTML：
<nav>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</nav>如果你看一下控制台，看起来像这样：
<nav>
<a href="#">Services</a>
<a href="#">Product</a>
<a href="#">Vision</a>
<a href="#">Features</a>
<a href="#">About</a>
<a href="#">Contact</a>
</nav>我希望我的措辞是正确的，这是我第一次在这里提问。