Search code examples
reactjssyncfusiondaterangepicker

How to get the value of DateRangePicker (syncfusion) on react js


I have a date range picker from Syncfusion, I installed the package and import the component to my react project. I'm pretty much new to DateRangePicker, so I wonder how can I get the value of the DateRangePicker.

here is my code

import React from 'react'
import './DateRangePicker.css'
import {DateRangePickerComponent} from '@syncfusion/ej2-react-calendars'

function DateRangePicker(){
    return(
        <>
            <DateRangePickerComponent></DateRangePickerComponent>
        </>
    )
}

export default DateRangePicker

Here is the output:

enter image description here


Solution

  • You can get the value of DateRangePickerComponent by pass a prop: change

    function DateRangePicker(){
        const onChange = (props) => {
            const stateDate = props.startDate;
            const endDate = props.endDate;
    
        };
        return(
            <>
                <DateRangePickerComponent change={onChange} />
            </>
        )
    }