如何为Material-ui TextField Type = date设置默认日期 [英] how to set a default date for a Material-ui TextField Type=date

问题描述

我刚刚开始使用React，并且我正在尝试使用包含材料的日期选择器

I just started working with React and I am trying to use a date picker using the material

它看起来像这样:

      <TextField
        name="someDate"
        label="Some Date"
        InputLabelProps={{ shrink: true, required: true }}
        helperText={errors.someDate}
        FormHelperTextProps={{ hidden: !this.hasError('someDate') }}
        type="date"
        error={this.hasError('someDate')}
        onChange={this.handleSomeDateChange}
        value={values.someDate}
      />

设置:type ="date"给我日期选择器，但它也将默认值的格式覆盖为"dd/mm/yyyy".我希望默认值是values.someDate我尝试使用defaultValue属性和如上所示的值属性，但是没有运气.更改标签的唯一方法是，如果我删除type ="date"，这也会删除日期选择器.

Setting: type="date" gives me the date picker but it also overlays the format for the default value to "dd/mm/yyyy". I want the default value to be values.someDate I've tried using the defaultValue prop and the value prop as shown above with no luck. The only way to change the label is if I remove type="date" which also removes the datepicker.

如何在渲染时将其设置为values.someDate?

How I can I set it to values.someDate on render?

推荐答案

它似乎应该与defaultValue一起使用:

it looks like it should work with defaultValue:

请在这里查看它的工作原理: https://codesandbox.io/s/9y6yz462op

Please see it working here: https://codesandbox.io/s/9y6yz462op

const values = {
  someDate: "2017-05-24"
};

function App() {
  return (
    <div className="App">
      <TextField
        name="someDate"
        label="Some Date"
        InputLabelProps={{ shrink: true, required: true }}
        type="date"
        defaultValue={values.someDate}
      />
    </div>
  );
}

这篇关于如何为Material-ui TextField Type = date设置默认日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！