猫头鹰旋转木马 - 类型错误：无法读取未定义的属性“fn”

Question

我尝试在我的反应应用程序中使用 owl.carousel 包。我使用 npm 安装了 jquery 和 owl.carousel 包。

npm install jquery owl.carousel

在 App.js 中

import React from 'react';
import $ from 'jquery';
import 'owl.carousel';


componentDidMount() {
$('.team-slides').owlCarousel({
// my options
});
}

我收到错误消息

TypeError: Cannot read property 'fn' of undefined.
/owl.carousel/dist/owl.carousel.js:1718

  1715 |  * @todo Navigation plugin `next` and `prev`
  1716 |  * @public
  1717 |  */
> 1718 | $.fn.owlCarousel = function(option) {
       | ^  1719 |  var args = Array.prototype.slice.call(arguments, 1);
  1720 | 
  1721 |    return this.each(function() {

请帮我解决这个问题。

Answer 1

你必须将这些包含在你的index.html

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
    integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
    crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
    integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
    crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
    integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
    crossorigin="anonymous"></script>


  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>

Answer 2

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>

这一个就足够了，尝试这个脚本，我希望你的轮播能够正常工作。