时间戳

首页 > 解决方案 > 找不到句柄选择反应日期范围

javascript - 找不到句柄选择反应日期范围

问题描述

我正在使用 react-date-range 开发一个关于 React js 的项目。如果有人可以提供帮助，它会引起一些问题。

我已经使用这些命令安装了第一个 react-date-range： npm install react-date-range & npm install --save react-date-range

但是当我导入它进行实施时，它在它下面显示一条红线： import {DateRangePicker} from ' react-date-range '

handleSelect 函数也显示错误，这是没有导入语句的代码的第一部分：

const PageHeader: React.FC = () => {
    const selectionRange = {
        startDate: new Date(),
        endDate: new Date(),
        key: 'selection',
    }
    handleSelect(ranges){
        console.log(ranges);

    }

这部分显示错误：

*handleSelect(ranges){ console.log(ranges);

}*

这是它下面的代码的第二部分：

return (
    <Row>
      <Col span={24}>
        <div className="page-title">
            <b>Charts</b>
        </div>
          <DateRangePicker
              ranges={[selectionRange]}
              onChange={this.handleSelect}
          />
      </Col>

这部分显示错误：

          *onChange={this.handleSelect}*

请注意文件的扩展名是 tsx

提前致谢

标签： javascriptreactjstypescript

解决方案

似乎你有一个错字：

function handleSelect(ranges){ // add the function keyword
     console.log(ranges);
}

或者：

const handleSelect = (ranges) => { // add the arrow function assignment 
     console.log(ranges);
}

此外，正如我所见，您不在类组件中，因此您不需要this关键字。

onChange={handleSelect} // right here

推荐阅读