Javascript 如何获取物料UI日期选择器值

我正在使用材质ui日期选择器。我试图做的是让用户选择值，并将其设置为状态，但我很难弄明白这一点，因此任何帮助都将不胜感激

下面是我目前正在做的事情：

我的日期选择器组件如下所示：

<DatePicker
  hintText="Select the date"
  formatDate={(date) => moment(date).format('DD-MM-YYYY')}
  onChange={this.handleChange1.bind(this)} />

建造商：

constructor(props){
 super(props);
  this.state = {
   appointmentDate: '',
   appointmentTime: ''
 };

所有这些在控制台中为我提供了以下信息

null Fri Oct 20 2017 16:50:33 GMT+0100 (BST)

及

但是，在文本字段中，一旦用户选择日期，我就可以看到正确呈现的日期，如2017年10月20日

显示给用户的日期是我要存储到状态的日期。 有人能解释一下如何做到这一点吗

---

谢谢

您需要将日期选择器转换为受控输入。日期选择器可以绑定的对象是日期对象。所以你的初始状态应该是

this.state={appointmentDate:null}

然后可以使用以下控件绑定日期

 <DatePicker
      hintText="Select the date"
      formatDate={(date) => moment(date).format('DD-MM-YYYY')}
      onChange={this.handleChange1.bind(this)} 
      value={this.state.appointmentDate}/>

如果要在状态中将日期的格式化字符串存储为单独的条目，可以使用handleChange1函数进行存储

handleChange1(e, date){
        this.setState({
           appointmentDate: date,
           appointmentDateString:  moment(date).format('DD-MM-YYYY')
        });
    }

---

您得到的日期只是缺少格式设置 当您有此信息时，“2017年10月20日星期五16:50:33 GMT+0100（英国夏令时）” 做这样的事

      var date = new Date("Fri Oct 20 2017 16:50:33 GMT+0100 (BST)")
      var finaldate = date.getDate() + '-' +  (date.getMonth() + 1)  + '-' +  date.getFullYear()

最后，您将获得finaldate=“20-10-2017”

希望这有帮助

多谢各位

handleChange1(e, date){
    this.setState({
       appointmentDate: date
    });
}

handleChange1(e, date){
        this.setState({
           appointmentDate: date,
           appointmentDateString:  moment(date).format('DD-MM-YYYY')
        });
    }

      var date = new Date("Fri Oct 20 2017 16:50:33 GMT+0100 (BST)")
      var finaldate = date.getDate() + '-' +  (date.getMonth() + 1)  + '-' +  date.getFullYear()