我的问题是关于 material-ui 4，material-ui/pickers compaiing 的不存在的“mask”属性

Question

使用 Material-UI (mui) 将 reactjs 项目从 v3 升级到 v4，并遵循推荐的迁移指南。 作为将 material-ui-pickers 2.2.1 替换为 @material-ui/pickers 的一部分。

DatePicker 组件现在抱怨过去在 mui3 上正常工作的“掩码”属性不存在。

迁移指南没有提到 Pickers。所以我想知道。 现在我回滚到使用 mui 3.9 和 material-ui-pickers 2.2.1。

import { DatePicker, DateTimePicker } from '@material-ui/pickers';

// later on...

return (
    <DatePicker
      name={name}
      value={value}
      clearable
      autoOk
      onChange={handleChange}
      format="DD/MM/YYYY"
      placeholder="___/___/______"
      mask={masked(value)}         // <=== The mask property
      {...other}
    />
  );

预期的行为是 DatePicker 应该像在 mui v3 中一样工作，因为迁移指南中没有提到任何内容。

实际是组件的掩码属性不再存在。

Answer 1

Upgrading to v3 page 中的 And now no more need in mask prop 部分说：

将根据格式自动生成和应用掩码 通过了。

如果您查看DatePicker API，您会发现没有mask 属性，因此您必须使用format 属性，或者您可以使用KeyboardDatePicker，它有一个mask 属性可用于覆盖从格式生成。

Answer 2

如果是自定义日期格式，您还应该更新掩码以匹配相同的日期格式。

例子：

 <MuiDateTimePicker
   inputFormat="DD/MM/yyyy HH:mm:ss"
   mask={"__/__/____ __:__:__"}   
   />