Javascript React.JS:Datepicker引导

我正在尝试使用引导创建日期选择器：

指南建议我以以下方式初始化：

$(document).ready(function() {
    $('.it-date-datepicker').datepicker({
      inputFormat: ["dd/MM/yyyy"],
      outputFormat: 'dd/MM/yyyy',
    });
});

我有一个datepicker.js页面：

 return(
<div className="it-datepicker-wrapper">
            <div className="form-group">
            <label htmlFor="date1" style = {props.input.value ? { fontSize: 12.432 } : { fontSize: 16 }}>{props.label}  {props.required || props.input.required == true ? " *" : ""}</label>

<DateTimeInput
                {..._.omit(props, 'input')}
                {...props.input}
                disabled={props.disabled}
                // placeholder={props.placeholder || props.label || null}
                period={props.period}
                onBlur={() => props.input.onBlur()}
                returnFormat={props.returnFormat}
                dateFormat={props.dateFormat}
                isValidDate={props.isValidDate || null}
                initialValue={props.initialValue}
                timeFormat={props.timeFormat}
                
                />

返回(
{props.label}{props.required | | props.input.required==true？*：“”
props.input.onBlur（）}
returnFormat={props.returnFormat}
dateFormat={props.dateFormat}
isValidDate={props.isValidDate | | null}
initialValue={props.initialValue}
timeFormat={props.timeFormat}
/>

在DateTimeInput页面中：

   let date = $(document).ready(function() {
      $('.it-date-datepicker').datepicker({
        inputFormat: ["dd/MM/yyyy"],
        outputFormat: 'dd/MM/yyyy',
      });
  });

et DateTimePicker = {
      ...input,
      input: true,
      value: value ? moment(value) : null,
      timeFormat: this.props.timeFormat ? this.props.timeFormat : false,
      viewMode: "months",
      dateFormat: this.props.dateFormat,
      isClearable: this.props.isClearable || true,
      className: "form-control it-date-datepicker",
      onChange: this.handleChange,
      onBlur: this.handleOnBlur,
      closeOnSelect: false,
      disableOnClickOutside: false,
      inputProps: {
        disabled: this.state.disabled || false,
        placeholder: this.props.placeholder
      },
      timeConstraints: { hours: { min: 6, max: 23, step: 1 }},
      id: `input_${this.props.name}`
    }
    console.log("DateTimePicker", DateTimePicker)
    if (this.props.isValidDate && typeof this.props.isValidDate === 'function' ){
      DateTimePicker["isValidDate"] = this.props.isValidDate
    }

    return (
      <React.Fragment>
        <DateTime {...DateTimePicker} />
      </React.Fragment>

let date=$（文档）.ready（函数（）{
$（'.it date-datepicker'）.datepicker({
输入格式：[“dd/MM/yyyy”]，
输出格式：“dd/MM/yyyy”，
});
});
et日期时间选择器={
…输入，
输入：正确，
值：值？力矩（值）：空，
timeFormat:this.props.timeFormat？this.props.timeFormat:false，
查看模式：“月”，
dateFormat:this.props.dateFormat，
isClearable:this.props.isClearable | | | true，
className:“表单控件it日期选择器”，
onChange:this.handleChange，
onBlur:这个，handleOnBlur，
closeOnSelect:false，
disableOnClickOutside:false，
输入道具：{
禁用：this.state.disabled | | false，
占位符：this.props.placeholder
},
时间限制：{hours:{min:6，max:23，step:1}，
id:`input_${this.props.name}`
}
log（“DateTimePicker”，DateTimePicker）
if（this.props.isValidDate&&typeof this.props.isValidDate==='function'）{
DateTimePicker[“isValidDate”]=this.props.isValidDate
}
返回(

现在我已经创建了日期选择器，但当我单击它时，我收到错误：

未捕获的TypeError:无法读取未定义的属性“top”

我如何解决这个问题？因为我不能使用datepicker