Javascript 如何从日期选择器获取日期（值）并将其分配给对象的属性？

我正在使用

react-datepicker

库。如何从

DatePicker

组件中提取值，并将其分配给

Pick

对象中的

date

属性。从输入端下载数据很简单。如何使用数据选择器进行此操作

class Form extends Component {
  constructor(){
    super();
    this.state = {
      startDate: new Date()
    }
  }

  create(event) {
    event.preventDefault();

    const pick = {
      date: this.date.value, /
      color: this.color.value,
     description: this.description.value
    }

   this.form.reset();
  }

  handleChange = (date) => {
    this.setState({
      startDate: date
    });
  }

  render() {

    return (
      <form ref={(input) => this.form= input} onSubmit={(e) => 
          this.create(e)}>
      <div>
          {/*<input ref={(input) => this.date = input} type="text" 
          />*/}
       <DatePicker
        dateFormat="yyyy/MM/dd"
        selected={this.state.startDate}
        onChange={this.handleChange} 
      />
      <input ref={(input) => this.time = input} type="text" />
    </div>

       <textarea ref={(input) => this.description = input} 
     placeholder="" ></textarea>

       <div >
         <button >Cancel</button>
         <button type="submit">Save</button>
       </div>
     </form>
    )
   }
 }

类表单扩展组件{
构造函数（）{
超级（）；
此.state={
起始日期：新日期（）
}
}
创建（事件）{
event.preventDefault（）；
常数选取={
日期：this.date.value/
颜色：this.color.value，
description:this.description.value
}
this.form.reset（）；
}
handleChange=（日期）=>{
这是我的国家({
开始日期：日期
});
}
render（）{
返回(
this.form=input}onSubmit={（e）=>
这个。创建（e）}>
{/*this.date=input}type=“text”
/>*/}
this.time=input}type=“text”/>
this.description=input}
占位符=”“>
取消
拯救
)
}
}

假设您的其余代码按预期运行，表单提交时将处于您的状态，因此请从那里获取：

const pick = {
      date: this.state.startDate, 
      color: this.color.value,
     description: this.description.value
    }

您需要确保datePicker表单上的名称与您所在州的名称匹配。所以如果你的州是

this.state = {
   date: new Date();
}

然后该字段上的输入也需要是日期

 <input
                    name="date"
                    id="date"
                    type="date"
                    defaultValue="2017-05-24"
                    onChange={handleInputChange}
                    value={inputs.date}
                />

---

我发布的方法允许您将其重新用于任何表单组件。只需确保表单输入名称与正在使用的状态匹配即可

我这样试过了。但我有一个错误：

Uncaught不变量冲突：对象作为React子对象无效（发现时间：Wed Jun 05 2019 13:48:03 GMT+0200（czasśrodkowoeuropejski letni））。如果要呈现子对象集合，请改用数组。

该错误是由此更改引起的还是以前存在过？你有没有漏掉一些密码？在哪里用镐？我换的时候。现在你能帮我吗？

 <input
                    name="date"
                    id="date"
                    type="date"
                    defaultValue="2017-05-24"
                    onChange={handleInputChange}
                    value={inputs.date}
                />