基于React应用中StylesProvider的Material-UI的RTL布局

Question

我在文档版本4.1.1的基础上使用了rtl material-ui，但是某些组件在rtl布局中可以正常工作，但是某些组件不会受到影响，例如TextField。

import { create } from 'jss';
import rtl from 'jss-rtl';
import { StylesProvider, jssPreset } from '@material-ui/styles';

// Configure JSS
const jss = create({ plugins: [...jssPreset().plugins, rtl()] });

function RTL(props) {
  return (
    <StylesProvider jss={jss}>
      {props.children}
    </StylesProvider>
  );
}

<RTL>
<ThemeProvider theme={theme}>
      <div dir="rtl">
        <TextField  placeholder="Name" />
        <input type="text" placeholder="Name" />
      </div>
    </ThemeProvider>
</RTL>

enter image description here