Question

我是react.js应用程序的初学者，并且我的Form类中有DatePicker组件。我正在尝试使用handleChange更新和存储所选日期，但我不知道datepicker的值是什么，我不确定如何之所以这么做，是因为我将其作为一个组件导入。对不起，如果我不能很好地解释它，我是React应用程序的初学者。

   constructor() {
    super();
 this.state = {

      formData: {
    //i have other states here but this is the one i am having trouble with 
    //updating data
         bookTime: {
          data: "",
          name: "bookTime",
          category: "DatePicker",
          everFocused: false,
          isValid: true,
          startDate: new Date(),
          extra : {
            label:"Randevu Tarihi*",
            help: "Geçersiz Alan!"
          }
       },
     }
   };
 this.handleChange = this.handleChange.bind(this);
}

这个表单类的代码不是我的，但是我试图在其中添加一个日期选择器，并且我试图不更改太多东西，因为这不是我的代码。 handleChange方法不属于我，那是为什么我要尝试使用这种格式更新数据。

handleChange(e) {
    let val = e.target.value;
    console.log(e.target.value)
    let name = e.target.name;
    let category = e.target.getAttribute("category");
    let startDate = e.target.getAttribute("category");

    this.setState(prevState => ({
      formData: changeHandler(prevState.formData, val, name, category,startDate)
    }));
  }

changeHandler方法是这个;

export const changeHandler = (data, val, name, category) =>{
 // Update the field value and get the field to validate (and name of that field)
  Object.keys(data).forEach((key, idx) =>{
     if (key === name) {
       data[key].data = val;
         return; 
       } 
    }); 
return findAndValidateField(data, name, category); 
};

该div在我的表单类中，我没有声明className是因为我不知道它会完全影响什么

 <div
                  className={"" + (bookTime.isValid ? "" : " is-danger")}
                >
                <div>
                 <DatePicker className="turkish"
                   locale={tr}
                   selected={bookTime.startDate}
                   onChangeRaw={this.handleDateChangeRaw}
                   showTimeSelect
                   minTime={setHours(setMinutes(new Date(), 0), 7)}
                   maxTime={setHours(setMinutes(new Date(), 0), 22)}
                   minDate={subDays(new Date(), 0)}
                   timeFormat="HH:mm"
                   timeIntervals={60}
                   dateFormat="HH:mm,d MMMM yyyy"
                   timeCaption="Saat"


                   name={bookTime.name}
                   category = {bookTime.category}
                   onBlur={this.handleBlur}
                   onChange={this.handleChange}

                  />
                  </div>

我希望更新日期选择器的selecteddate的值并像在表单中的其他表单状态一样存储

我无法在表单类中存储DatePicker组件的值

0 个答案: