Search code examples
javascriptreactjscompiler-errorsdaterangepicker

Failed to compile src\Search.js: setEndDate, selectionRange and handSelect are not defined


import React,{useState} from 'react'
import './search.css'
import "react-date-range/dist/styles.css";
import "react-date-range/dist/theme/default.css"
import {DateRangePicker} from "react-date-range";

function Search() {
   const[startDate,setStartDate]=useState(new Date());
   const[endDate,setendDate]=useState(new Date());

const selctionRange = {
    startdate:startDate,
    endDate:endDate,
    key:"selection",
}

function handleSelect(ranges){
    setStartDate(ranges.seection.startDate);
    setEndDate(ranges.selection.endDate);
}
return (
    <div className="search">
        <DateRangePicker ranges={
            [selectionRange]} onChange={handSelect}/>
         
    </div>
)
}

export default Search

the above is the code and this is the error

Failed to compile src\Search.js Line 19:9: 'setEndDate' is not defined no-undef Line 24:18: 'selectionRange' is not defined no-undef Line 24:45: 'handSelect' is not defined no-undef

Search for the keywords to learn more about each error.


Solution

  • You're using setEndDate but you defined setendDate in your useState (without the major E).

    Edit: Same thing for selectionRange, you defined selctionRange and handSelect with handleSelect. Only typos.