Question

我正在尝试使用react-bootstrap-datetimerangepicker，并且在在线演示（http://luqin.xyz/react-bootstrap-datetimerangepicker/#/）中，在单击时打开的菜单顶部似乎有一个文本输入字段。

在我的实现中，该文本输入框未出现。

我想知道我是否错误地导入了.css？但是我复制了示例的源代码，但仍然得到了这个结果。

import 'bootstrap/dist/css/bootstrap.css';
import DatetimeRangePicker from 'react-bootstrap-datetimerangepicker';
import 'bootstrap-daterangepicker/daterangepicker.css';

class Sidebar extends Component{
constructor(props) {
    super(props);
    this.state = {
      fromDate: new Date(),
      toDate: new Date(),
    };
 }
 handleApply(event, picker) {
    this.setState({
      fromDate: picker.startDate.format('YYYY-MM-DD HH:mm:ss'),
      toDate: picker.endDate.format('YYYY-MM-DD HH:mm:ss'),
    });
 }
 render(){
    return(
         <DatetimeRangePicker
              timePicker={true}
              timePicker24Hour={true}
              timePickerSeconds={true}
              showDropdowns={true}
              onApply={this.handleApply}
              opens={"center"}
              startDate={this.state.fromDate}
              endDate={this.state.toDate}>

               <Button >
                Date and Time Range
               </Button>}

         </DatetimeRangePicker>
  )
}
}

Answer 1

所以我推测，这与我使用的版本有关。

如此处所述： https://github.com/skratchdot/react-bootstrap-daterangepicker/issues/185

我通过运行npm i --save bootstrap-daterangepicker@2.1.27切换了我的版本，现在通过手动文本输入选择器将其恢复为旧版本

react-bootstrap-datetimerangepicker：没有文本输入字段

1 个答案: