Question

我正在使用browserify，我想使用bxslider。当我将所有模板放在一个文件（index.html）中时，它正在运行。现在我使用browserify来构建它，所以我有vue组件。我想在vue组件中使用bx滑块。

slider.vue

<ul class="bxslider">
      <li>
             <img src="img/thumb-01.jpg"/>
       </li>
</ul>

的index.html

<link href="plugins/bxslider/jquery.bxslider.css" rel="stylesheet" />
       <div id="app"></div>
       <!-- scripts -->
    <script src="plugins/jQuery/jQuery-2.2.0.min.js"></script>
    <script src="plugins/bxslider/jquery.bxslider.min.js"></script>
    <script src="dist/build.js"></script>
    <script>
  $(document).ready(function(){
     $('.bxslider').bxSlider();
  });
</script>

我无法获得bxslider，我尝试将其用作组件中的函数，同时尝试在单独的文件中使用它。有什么建议吗？

Answer 1

问题是$(document).ready()在vue.js代码之前执行。您需要替换此代码

$(document).ready(function(){
  $('.bxslider').bxSlider();
});

带

$(document).ready(function(){
  setTimeout(function(){
    $('.bxslider').bxSlider();
  },100);
});

Vue.js＆amp; bxslider，滑块无法加载。有关如何解决它的任何想法？

1 个答案: