如何本地化 MUI(v5) 日期选择器输入或设置占位符

Question

我必须使用 MUI5 DesktopDatePicker，如手册中所示https://mui.com/components/pickers/#react-components。

当我清除所选日期时，我看到 dd/mm/yyyy 作为占位符作为 DatePicker 的输入格式。我希望看到基于本地化集的占位符，例如gg/mm/aaaa 用于意大利语言环境。这可能吗？甚至设置自定义占位符？

这是直接从 MUI5 演示派生的沙盒。

https://codesandbox.io/s/desktopdatepicker-jfqk7

Answer 1

您必须在不覆盖 params.inputsProps 上的数据的情况下更改 renderInput 上文本字段的占位符。这将是您的新 DesktopDatePicker。

<DesktopDatePicker
      label="Date desktop"
      inputFormat="dd/MM/yyyy"
      value={value}
      onChange={handleChange}
      renderInput={(params) => (
        <TextField
          {...params}
          inputProps={
            { 
              ...params.inputsProps, 
              placeholder: "dd/mm/aaaa" 
            }
          }
        />
      )}
    />

这是固定 CodeSandBox 示例的 link，日期选择器组件在 demo.js