I try to convert this jquery code into the react js format but i don't have any idea how i achieve this

Question

how can I use jquery in react js

<script>
    $('#demo').daterangepicker({
        "startDate": "01/21/2023",
        "endDate": "01/27/2023"
    }, function(start, end, label) {
      console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')');
    });
</script>

Robin Hood · Answer 1 · 2023-01-28T13:06:44.920

Go to your project folder via terminal and run these commands

npm install jquery --save
npm i --save-dev @types/jquery

Use import $ from jquery into your JSX file where you need to use. your main.jsx file will be like this

import React from 'react';
import ReactDOM from 'react-dom';
import $ from 'jquery';


//   react code here


$('#demo').daterangepicker({
    "startDate": "01/21/2023",
    "endDate": "01/27/2023"
}, function(start, end, label) {
  console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')');
});

// react code here

and your index.html will be like this

<!DOCTYPE html>
<html>
<head>
    <script src="main.jsx"></script>
</head>
<body>
    //your code
</body>
</html>

Reference

I try to convert this jquery code into the react js format but i don't have any idea how i achieve this

1 Answers1