（材料UI / Next.js）从服务器端渲染停止useStyles

Question

我当前正在处理我的应用程序中需要在样式上访问window对象的页面。

我了解到对于不应仅使用$header .= 'Content-Transfer-Encoding: 8BIT';在服务器上呈现的组件而言，它确实可以做到。但是，当从useStyles访问窗口时，此函数在<NoSsr>函数之前被调用。意味着一旦击中render()，错误：classes=useStyles()仍然存在。

关于如何阻止useStyles调用在服务器上呈现的任何想法？

谢谢！

Answer 1

（回答自己）

找到了可以在这种情况下使用的解决方案：

1. 在应有权访问全局窗口对象的组件周围使用<NoSSr>。

2. 在对象上使用style={{}}而不是使用useStyles()和className的全局样式。

3. 如果需要访问主题，请使用const theme = useTheme()的{​​{1}} importend