使今天按钮更新选择日期为反应选择日选择器

Question

Im 使用 React 日期选择器 http://react-day-picker.js.org/

我使用今天按钮：http://react-day-picker.js.org/examples/customization-today-button/

"今天"按钮的默认行为是导航到当前月份，但不选择实际日期。如何让它选择实际日期？这是更新此代码示例中的选定日期状态

import React from 'react';
import DayPicker from 'react-day-picker';
import 'react-day-picker/lib/style.css';
export default class BasicConcepts extends React.Component {
  constructor(props) {
    super(props);
    this.handleDayClick = this.handleDayClick.bind(this);
    this.state = {
      selectedDay: undefined,
    };
  }
  handleDayClick(day) {
    this.setState({ selectedDay: day });
  }
  render() {
    return (
      <div>
        <DayPicker onDayClick={this.handleDayClick} />
        {this.state.selectedDay ? (
          <p>You clicked {this.state.selectedDay.toLocaleDateString()}</p>
        ) : (
          <p>Please select a day.</p>
        )}
      </div>
    );
  }
}

Answer 1

您可以使用

onTodayButtonClick并将日期设置为选定日期：

<DayPicker 
   selectedDays={this.state.selectedDay}
   todayButton="Select today" 
   onTodayButtonClick={day=>this.setState({selectedDay: day})
/>