Material ui DatePicker可以使用没有对话框的类似组件吗? [英] The Material ui DatePicker can use like component without dialog?

问题描述

我想在Material UI中使用DatePicker，并且希望它始终显示在模板中，但是DatePicker的默认设置是集中在Textfield上并显示对话框.

是否可以在不使用Dialog和焦点文本字段的情况下显示DatePicker.让它始终在渲染显示中显示DatePicker组件吗?

解决方案

[ material-ui v0.x 的解决方案]

如果我对您的理解正确，那么您想显示 DatePicker 中的 Calendar 组件，而无需任何对话框和输入.在这种情况下，您可以像这样导入内部 Calendar 组件:

 从'material-ui/DatePicker/Calendar'导入日历； 

然后渲染，例如:

 <日历autoOk = {假}cancelLabel = {false}firstDayOfWeek = {1}onTouchTapDay = {this.handleTouchTapDay}模式= {'肖像'}打开= {true}ref ="calendar"/> 

还有其他一些可用于 Calendar 的道具，我在此示例中没有使用过.您可以在

I want to use the DatePicker in Material UI, and I want it always show in the template, but the default of DatePicker is focused the Textfield and show the Dialog.

Does it possible to show DatePicker without using Dialog and focused Textfield. Let it always show the DatePicker Component at the render show?

解决方案

[Solution for the material-ui v0.x]

If I understood you correctly, you want to display Calendar component from DatePicker without any dialog and input. If that is your case, you can import the inner Calendar component like this:

import Calendar from 'material-ui/DatePicker/Calendar';

and then render, for example:

<Calendar 
    autoOk={false}
    cancelLabel={false}
    firstDayOfWeek={1}
    onTouchTapDay={this.handleTouchTapDay}
    mode={'portrait'}
    open={true}
    ref="calendar"
/>

There is some other props that is available for Calendar, that I hadnt use for this example. You can find them here in the source code of Calendar:

Here is what I got after render:

这篇关于Material ui DatePicker可以使用没有对话框的类似组件吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！