Question

import React, {Component} from 'react';



import {DateRangePicker, SingleDatePicker, DayPickerRangeController} from 'react-dates';
import 'react-dates/lib/css/_datepicker.css';

class Clients extends Component {
  constructor(props) {
    super(props);
    this.state = {
      focusedInput: '',
      startDate: '',
      endDate: ''
    };
    this.onDatesChange = this.onDatesChange.bind(this)
    this.onFocusChange = this.onFocusChange.bind(this)
  }
  onDatesChange({startDate, endDate}) {

    this.setState({startDate, endDate});
  }

  onFocusChange(focusedInput) {
    this.setState({focusedInput});
  }

  render() {
    const {focusedInput, startDate, endDate} = this.state;

    return (<div className="animated fadeIn">


      <div>
        <DateRangePicker
          onDatesChange={this.onDatesChange} 
          onFocusChange={this.onFocusChange}
          focusedInput={focusedInput}
          startDate={startDate}
           endDate={endDate}/></div>

    </div>);
  }
}

export default Clients;

错误是： arning：失败的道具类型：无效的输入类型：startDate类型string提供给DayPickerRangeController，预期object。在DayPickerRangeController中（由DateRangePicker创建）在DateRangePicker中（由withStyles（DateRangePicker）创建） in withStyles（DateRangePicker）（由客户创建）在div（由客户创建）在div（由客户创建）在客户端（由路由创建）在路线（由完整创建）在Switch中（由Full创建）在div中（由Container创建）在容器中（由Full创建）在main（由Full创建）在div（由Full创建）在div（由Full创建）全部（由路线创建）在路线在Switch中在路由器（由HashRouter创建）在HashRouter

当我点击startdate选择日期任何帮助时会发生这种情况吗？

Answer 1

使用moment库设置startDate

解决了问题

安装时刻：

 npm i moment --save
 yarn add moment

导入组件的时刻：

import moment from 'moment'

在具有时刻对象的反应日期设置startDate

startDate={moment()}

如何正确使用reactjs中的react-dates

1 个答案: