【问题标题】:How to disable underline to Material UI's datepicker in React?如何在 React 中禁用 Material UI 的日期选择器的下划线?
【发布时间】:2018-10-28 10:17:50
【问题描述】:

如何禁用在 material-ui-pickers 中显示下划线?

沙盒 https://codesandbox.io/s/l2ykr7kwvz?from-embed

我想删除其TextField 的下划线。

我试过了

disableUnderline={true}

underlineStyle={{display: 'non'}}

showingUnderline={false}

但没有任何效果,如何隐藏下划线?

<DatePicker
    underlineStyle={{display: 'none'}}
    value={selectedDate}
    onChange={this.handleDateChange}
    animateYearScrolling={false}
/>

【问题讨论】:

标签: reactjs material-design material-ui


【解决方案1】:

material-ui date-picker 是一个来自基础的文本字段,您可以简单地使用 input-props 删除下划线

(DatePicker、TimePicker 和 DateTimePicker 都会这样工作)

<DatePicker
  value={selectedDate}
  InputProps={{
   disableUnderline: true,
  }}
  onChange={this.handleDateChange}
/> 

here找到示例

希望对你有帮助

【讨论】:

  • InputPropsDatePicker 的一个道具。它是一个不可识别的道具,因此它被传递给TextField 组件(如here 所述)。
  • 不仅仅是DatePicker,即使它适用于TextField。 @Nadun 和 @Juntae,非常感谢您的提问和回答。
  • 知道如何为时间选择器做同样的事情吗?
  • 这对我有用。谢谢你。文档中是否有关于此功能如何工作的参考?
  • 明智的说法,InputProps 区分大小写并大写...这在属性/属性中很奇怪。讨厌的隐形故障点。
猜你喜欢
  • 1970-01-01
  • 2018-10-23
  • 1970-01-01
  • 1970-01-01
  • 2020-02-06
  • 2021-07-12
  • 1970-01-01
  • 2021-02-09
  • 1970-01-01
相关资源
最近更新 更多