Datipi-react NPM

datipiReact

datipiReact is a JavaScript library that provides a React-friendly wrapper for the jQuery DateTimePicker.

Installation

You can install datipiReact using npm or yarn:

npm install datipi-react --save

yarn add datipi-react

Usage

To use datipiReact in your React project, follow these steps:

Import the DateTimePicker component at the top of your JavaScript/TypeScript file:

import * as datipiReact from 'datipi-react';

Use useEffect to call initDateTimePicker with the target DOM element and any options you wish to pass to the DateTimePicker, and return a cleanup function to call destroyDateTimePicker when the component unmounts.

  /**
   * A hook that initializes DateTimePickers when the component mounts
   * and destroys them when the component unmounts.
   */
  useEffect(() => {
    datipiReact.initDateTimePicker(
      '#date-of-birth',
      {
        format: 'Y-m-d'
      },
      setDateOfBirth);

    datipiReact.initDateTimePicker(
      '#start-date',
      {
        format: 'Y-m-d'
      },
      setStartDate);

    return () => {
      datipiReact.destroyDateTimePicker('#date-of-birth');
      datipiReact.destroyDateTimePicker('#start-date');
    };
  }, []);