Vue.js，如何导入和使用JQuery初始化一个materialize-css轮播

Question

我正在尝试将 materialize-css 与 Vue 一起使用，一切正常，但是某些 materialize 组件需要使用 JS 或 Jquery 进行初始化，现在，我没有之前使用 Jquery，我使用 npm i -s jquery 安装它，但我对如何以及在何处导入和使用它有点困惑。下面的代码来自关于如何初始化轮播的物化文档。非常感谢有关如何在 .vue 组件或任何替代方式中使用它的提示？

  document.addEventListener('DOMContentLoaded', function() {
    var elems = document.querySelectorAll('.carousel');
    var instances = M.Carousel.init(elems, options);
  });

  // Or with jQuery

  $(document).ready(function(){
    $('.carousel').carousel();
  });

提前致谢。

Answer 1

在您的组件中初始化 mounted 挂钩中的代码而不使用 jquery:

export default {
     ...
   mounted(){
        document.addEventListener('DOMContentLoaded', function() {
        var elems = document.querySelectorAll('.carousel');
        var instances = M.Carousel.init(elems);
      });


    }

Vue.js，如何导入和使用JQuery初始化一个materialize-css轮播

Vue.js, how to import and use JQuery to initialize a materialize-css carousel

javascript

jquery

materialize

vue.js

vuejs2