0.0.2 • Published 2 years ago

react-native-easy-date-picker v0.0.2

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

React Native Date Picker

This package will help to pick a single date and multiple dates in react native.

Attachments

Screenshot Screenshot Screenshot

Required Package

npm install @react-native-picker/picker --save
yarn add @react-native-picker/picker

Check the link here

Installation

yarn add react-native-easy-date-picker

or

npm install react-native-easy-date-picker --save

Example

Code

import React, { useRef } from 'react';
import {
  SafeAreaView,
  View,
  Text
} from 'react-native';
import CalendarDatePicker from 'react-native-easy-date-picker';


const ExampleOne = () => {
  const calendarDatePicker = useRef();

  const getSelectedDates = (selectedDates) => {
    console.log('hello', selectedDates)
  }

  return (
    <SafeAreaView style={{ flex: 1 }}>

      <View
        style={{ flex: 1, alignItems: "center", justifyContent: 'center' }}>
        <Text onPress={() => {
          calendarDatePicker.current.handleShow()
        }}>{'Show Picker'}</Text>

        <CalendarDatePicker
          ref={calendarDatePicker}
          getSelectedDates={getSelectedDates}
          multiSelect={true}
          maxNumOfDateSel={6}
          checkbefToday={true}
        />



      </View>

    </SafeAreaView>
  );
};



export default ExampleOne;

Check the code here

Props

PropDefaultTypeDescription
refreferenceused for show hide picker
multiSelectfalsebooleannumber of item per row
checkbefTodayfalsebooleanstyle of grid item view
maxNumOfDateSel-1numberstyle of entire listview

Instance Methods

MethodParamsDescription
getSelectedDatesarrayreturn selected dates

Author

Loganathan Rajamani