react-date-range
react-date-range copied to clipboard
Facing Cannot read property 'findIndex' of undefined /node_modules/react-date-range/dist/ utils.js
Subject of the issue
Describe your issue here. Getting Cannot read property 'findIndex' of undefined. Any suggestion ?
[BUG] Bug Reproduce Steps
Tell us how to reproduce this issue.
[BUG] Expected behaviour
Environment
Package Version: React version: Node version: Browser:
Hello. Thanks for reporting this.
Have you ran npm install date-fns
in your project folder?. This issue might be related.
If the problem continues please let me know so I can examine it. Thanks.
I had (I think) the same issue and installing date-fns does not resolve it. The error appears on the following line of utils.js:
function findNextRangeIndex(ranges) {
var currentRangeIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
var nextIndex = ranges.findIndex(function (range, i) { // <-- ERROR OCCURS HERE
return i > currentRangeIndex && range.autoFocus !== false && !range.disabled;
});
if (nextIndex !== -1) return nextIndex;
return ranges.findIndex(function (range) {
return range.autoFocus !== false && !range.disabled;
});
}
}
Passing in an empty range resolves the issue. I also had to pass an empty onChange as clicking a date without it also causes it to crash -- though other issues remain unfortunately.
<DateRangePicker
ranges={[]}
onChange={() => {}}
/>
Any Solution to this issue yet ?
Hello, I am also experiencing this exact issue and previously mentioned remedies have not worked. Has there been any progress on this front? Thanks in advance!
+1 and we are using NextJS if that helps.
By the way, it works as intended. You have to double check that you are modifying your state object to be exactly the way it is on the package with the selection and comparison.
You get this error when ranges is malformed, in my case my object was:
{
"startDate": "2022-06-01T00:00:00.000Z",
"endDate": "2022-06-29T00:00:00.000Z",
"key": "selection"
}
when ranges should be
[
{
"startDate": "2022-06-01T00:00:00.000Z",
"endDate": "2022-06-29T00:00:00.000Z",
"key": "selection"
}
]
it should be of type array, not object