material-ui - 将素材ui从v4升级到v5后，jss-rtl插件不起作用

Question

我将材料ui v4升级到v5，此后jss-rtl无法正常工作。该项目是用next js编写的。_app.js：

const jss = create({ plugins: [...jssPreset().plugins, rtl()] });
const emotionCache = {
    LTR: createCache({
        key: 'ltr',
        prepend: true,
    }),
    RTL: createCache({
        key: 'css',
        stylisPlugins: [rtlPlugin],
        prepend: true,
    }),
};
const cache = createCache({ key: 'css' });
cache.compat = true;
const selectedCache = direction !== 'rtl' ? emotionCache.LTR : emotionCache.RTL;
<StyledEngineProvider injectFirst>
        <StylesProvider jss={jss}>
            {/* <CacheProvider value={selectedCache}> */}
            <ThemeProvider theme={themes}>
                    <CssBaseline />
                        ...
            </ThemeProvider>
            {/* </CacheProvider> */}
        </StylesProvider>
    </StyledEngineProvider>

CacheProvider 是情感/反应组件。我认为它与 jss 有冲突，所以我对此发表了评论，但它没有改变。当 CacheProvider 在 RTL 模式下启用时，它可以与材质组件一起正常工作。但是我在 jss 中编写的其他元素不会在 rtl 中翻转。我在材料 v4 中检查了这些元素具有如下类：.jss45，但在 v5 中它没有这些类，而是它们的类是这样的：.makeStyles-listContainer-201 在 RTL 模式下不会改变。

标签： material-uinext.jsjss