Material-UI TextField - 在默认文本上呈现文本答案

【问题标题】：Material-UI TextField - renders Text over default TextMaterial-UI TextField - 在默认文本上呈现文本
【发布时间】：2020-04-05 13:24:16
【问题描述】：

我正在使用 Material-UI TextField 组件并且存在这个问题，它为“日期”和“时间”类型的文本字段呈现其值的格式。像这样：

我需要删除“TT.MM.JJJJ”和“--:--”。此时我呈现这些字段的代码如下所示：

<TextField
    label={label}
    type={type}
    value={value}
    InputLabelProps={{
      shrink: true
    }}
    onChange={(event) => this.onChange(event)}
    margin='normal'
    variant='outlined'
    disabled={disable}
  />

【问题讨论】：

Material-UI 受限于时间和日期选项。你无法真正摆脱它（你可以使用 CSS 来隐藏它）。有用于处理时间和日期的替代库
增加 Idan 的洞察力，您可以使用一些相关的 question，这可以帮助您。
谢谢@minu.273，这似乎适用于 chrome。
这能回答你的问题吗？ Remove default text/placeholder present in html5 input element of type=date

标签： reactjs label material-ui textfield

【解决方案1】：

感谢@minu.273 和@Idan，我找到了解决方案。我已将以下代码放入 .scss 文件中：

input[type="date"]:in-range::-webkit-datetime-edit-year-field, input[type="date"]:in-range::-webkit-datetime-edit-month-field, input[type="date"]:in-range::-webkit-datetime-edit-day-field, input[type="date"]:in-range::-webkit-datetime-edit-text { color: transparent; }

适用于 chrome

【讨论】：