Материал-Пользовательский интерфейс V5 RTL со стилистикой-плагин-rtl

#material-ui #next.js

Вопрос:

я использую материал UI 5 с next.js и выполнили все шаги точно так же, как в документации здесь, с эмоциями и стилизацией-плагин-rtl v2: https://next.material-ui.com/guides/right-to-left/#heading-jss но после обновления страницы моя метка при вводе перемещается влево, а при нажатии идет вправо, и в очерченном режиме размещение метки в рамке-это ltr, может ли кто-нибудь помочь?

 import rtlPlugin from 'stylis-plugin-rtl';
import { CacheProvider } from '@emotion/react';
import createCache from '@emotion/cache';

// Create rtl cache
const cacheRtl = createCache({
  key: 'muirtl',
  stylisPlugins: [rtlPlugin],
});

function RTL(props) {
  return <CacheProvider value={cacheRtl}>{props.children}</CacheProvider>;
}
 

Ответ №1:

Я думаю, вам следует определить, когда ваше приложение находится в режиме RTL, а затем обработать параметры createCache следующим образом:

 const cacheRtl = createCache({
  key: isRTL ? 'muirtl' : 'muiltr',
  stylisPlugins: isRTL ? [rtlPlugin] : [],
});
 

Комментарии:

1. спасибо, что проблема исправлена после обновления пользовательского интерфейса материала. я использовал бета-версию