使用反應最新http://airbnb.io/react-dates

Question

我用這個NPM https://www.npmjs.com/package/react-dates

和我做

import { SingleDatePicker } from 'react-dates'; 
and in my render function I do 

<SingleDatePicker id="date" /> 

...這是它，和它的工作。我試圖將SingleDatePicker更改爲其第二個API，並根據文檔，它是DateRangePicker。我可以看到它被渲染，但是當我點擊它時，它什麼都不做。我不知道什麼是錯的，我的控制檯沒有錯誤。

Answer 1

的react-dates README列出了所需的道具和他們對SingleDatePicker組件類型：

<SingleDatePicker 
    date={this.state.date} // momentPropTypes.momentObj or null 
    onDateChange={date => this.setState({ date })} // PropTypes.func.isRequired 
    focused={this.state.focused} // PropTypes.bool 
    onFocusChange={({ focused }) => this.setState({ focused })} // PropTypes.func.isRequired 
/> 

爲了處理用戶交互，則必須提供一個函數來onFocusChanged和一個bool於聚焦支柱（如上所示） 。通過上面的實現，您只需要爲您的狀態添加一個初始focused值。

即。 state = {... focused: false}

請注意，您需要使用moment包來將日期對象編入date支柱。