react-day-picker - 让今天按钮更新 selectedDay 以响应 DayPicker？

Question

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

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

今天按钮的默认行为是导航到当前月份，但不选择实际日期。我怎样才能让它选择实际的日子？这是在此代码示例中更新 selectedDay 状态

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})
/>