CODEWITHSUNDEEP
reactjscarouselowl-carousel
josh josh
josh josh

Reputation: 31

how to define this $ react JS

I have created app using create-react-app. I import owl.carousel but why it is showing this error.

how to define this $

  Line 12:15:  '$' is not defined  no-undef
  Line 21:5:   '$' is not defined  no-undef
  Line 24:5:   '$' is not defined  no-undef

Here is the Component Code


    var owl = $(".owl-carousel");
    owl.owlCarousel({
      items: 4,
      loop: true,
      margin: 10,
      autoplay: true,
      autoplayTimeout: 1000,
      autoplayHoverPause: true,
    });
    $(".play").on("click", function () {
      owl.trigger("play.owl.autoplay", [1000]);
    });
    $(".stop").on("click", function () {
      owl.trigger("stop.owl.autoplay");
    });

Cannot read property of undefined. this picture of error that I got

Upvotes: 0

Views: 138

Answers (1)

HoldOffHunger
HoldOffHunger

Reputation: 20901

Import jQuery to your project with ReactJS like so...

import $ from 'jquery';

Before you can do that, you must install it to your project. See the NPM documentation for more info: npm->jQuery. You can install it with npm by means of...

npm install --save jquery

And you can know the installation worked by checking your package.json file and seeing...

"dependencies": {
  "jquery": "^3.3.1",
  ....

Upvotes: 1

Related Questions