- Forums
- react
- How to add Jquery or JqueryUI Library to React Component
This Page Contains information about How to add Jquery or JqueryUI Library to React Component By dd in category react with 0 Replies. [5108], Last Updated: Mon Jun 24, 2024
dd
Sat Mar 25, 2023
0 Comments
381 Visits
Example: Date Pickter: https://jqueryui.com/datepicker/
1. Command to Install Jquery and JquerUI
$ npm i jquery
$ npm i jquery-ui-dist
2. Import
import $ from "jquery"
import "jquery-ui-dist/jquery-ui"
3. Add datepickter() function to useEffect
useEffect(() => {
$("#datepicker").datepicker();
}, [])
4. Add JSX to return()
<p>Date: <input type="text" id="datepicker" /></p>
5. Add CSS Style
Add CSS to public/index.html from Google API CDN Library: https://developers.google.com/speed/libraries
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/themes/smoothness/jquery-ui.css">
Video: bPVEOzimRik
Resources: https://legacy.reactjs.org/docs/integrating-with-other-libraries.html