当正文处于 RTL 时 HTML5 日期选择器不翻转

问题描述

我有一个 Material UI React 应用程序，可以在适当的时区更改为“RTL（从右到左）”。但是当正文在 RTL 中时，我使用的 HTML5 日期选择器不会翻转。如果我使用自定义日期选择器，则会翻转。有没有办法让 HTML5 日期选择器与 RTL 对齐？

https://codesandbox.io/s/suspicious-noyce-46r7j?file=/src/App.js

解决方法

您可以将 HTML5 日期选择器包装在 MUI 网格中

 <MuiPickersUtilsProvider utils={DateFnsUtils} locale={enGB}>
        <Grid container justify="space-around">
          <TextField
            id="need-before-date"
            variant="outlined"
            type="date"
            onChange={handleChange}
            placeholder="yyyy-mm-dd"
          />
        </Grid>
      </MuiPickersUtilsProvider>