Material ui 生成的jss类名自定义？

我正在开发一个微型前端概念验证应用程序，使用单个spa、react和material ui。我遇到了一个问题，从Mui生成的类名相互践踏，因为有多个独立的应用程序正在向父应用程序注册，并且每个子应用程序都有自己的Mui类名生成器

示例

Child app one是用于左导航的

抽屉

，正在向

头部添加以下
元素：

<style data-jss="" data-meta="MuiDrawer">
...
.jss3 {
  left: 0;
  right: auto;
}
...
</style>

<style data-jss="" data-meta="MuiAppBar">
...
.jss3 {
  top: 0;
  left: auto;
  right: 0;
  position: absolute;
}
...
</style>

当我检查
MuiDrawer
元素时，这些混乱的名称导致该类（以及其他类）最终看起来像这样：

.jss3 {
    top: 0;
    left: auto;
    right: 0;
    position: absolute;
}

我已经阅读了Mui文档和问题，试图找出是否有一种方法可以自定义每个应用程序中的命名，因此一个可以生成
.app1-jss3
，另一个可以生成
.app2-jss3
。到目前为止，我还没有找到任何解决这个问题的方法。寻找一些方向。
解释了您所有的问题（为什么名称看起来像这样，如何在生产中获得确定性名称，如何使用前缀）

如果遇到冲突的类名，最好在所有应用程序（react jss中提供）周围包装一个jss提供程序。
解决方案：

import JssProvider from 'react-jss/lib/JssProvider';
import { createGenerateClassName } from '@material-ui/core/styles';

const generateClassName = createGenerateClassName({
  seed: 'app1'
});

function App() {
  return (
    <JssProvider generateClassName={generateClassName}>
      ...
    </JssProvider>
  );
}

export default App;

从'react jss/lib/JssProvider'导入JssProvider；
从“@material ui/core/styles”导入{createGenerateClassName}；
const generateClassName=createGenerateClassName({
种子：“app1”
});
函数App（）{
返回(
...
);
}
导出默认应用程序；
在我的例子中，不要忘记禁用全局参数，否则它将无法工作

createGenerateClassName({
  disableGlobal: true,
  seed: 'app1'
});

对于react jss v10，您有什么解决方案吗。上述解决方案对我不起作用。挣扎了三天。任何帮助都将不胜感激。我没有。这是一个原型，我几个月内不会再访问它了。您是否尝试过下面提到的及其更新文档中的
disableGlobal
？我有办法解决这个问题。必须使用StyleProvider而不是JSSProvider。它起了很大的作用