超过了最大调用堆栈大小？

问题描述

当我在单独的项目中运行日期范围选择器时，我正在项目中添加日期范围选择器，它可以正常工作，但是当我尝试将日期范围选择器与我的项目集成时，则出现了使用相同代码“ Uncaught RangeError：Maximum call”的错误超出堆栈大小” 这是我的日期范围选择器的代码 这是我的Date.js文件

import React,{ Component } from 'react';

import  {DaterangePicker}  from 'react-date-range';
import { addDays } from 'date-fns';

import moment from 'moment'
import 'react-date-range/dist/styles.css'; // main style file
import 'react-date-range/dist/theme/default.css'; // theme css file

class Date extends Component {
  handleSelect(ranges){
    console.log(ranges);
 
  }
  constructor(props) {
    super(props);
    this.state = {
      selectionRange: {
        startDate: new Date(),endDate: addDays(new Date(),7),key: "selection"
      }
    }
  }
  

  handleDateSelect = (item) => {
    this.setState({
      ...item
    });
  }

  render()
  {
 
    return (
   
 
      <DaterangePicker
     
      onChange={(item) => this.setState({selectionRange: item.selection})}
   

      showSelectionPreview={true}
      moveRangeOnFirstSelection={false}
      months={2}
     
      ranges={[this.state.selectionRange]}
     
      direction="horizontal"
    />
    );
  }
}

export default Date

有人可以帮助我解决此问题吗？我在控制台中收到此错误

解决方法

您的班级被命名为Date，所以当您调用new Date()时，您正在调用该班级的构造函数。这种情况会递归发生，并导致堆栈溢出。

尝试将您的班级重命名为其他名称（例如DatePicker）。