使用vueJs

时间:2017-09-20 20:25:38

标签: jquery vue.js tabslideout

我正在使用jQuery tabSlideOut https://github.com/hawk-ip/jquery.tabSlideOut.js
它工作正常,但在我使用vueJs组件的页面上我得到$(...)。tabSlideOut不是一个函数。
我知道不建议在vueJs中使用jQuery,但事实并非如此,所以我没有理解为什么这不起作用。

<script src="assets/js/jquery.tabSlideOut.js"></script>
<script src="assets/js/tabSlideOut.js"></script>

$(document).ready(function() {
var left = $('#left').tabSlideOut({
  tabLocation: 'left',
  clickScreenToClose: false,
  offset: '40px',
  offsetReverse: true, // offset from bottom, not top
  // handlers: enable and disable buttons when sliding open or closed
  onOpen: function(){
      $('#open').prop('disabled',true);
      $('#close').prop('disabled',false);
  },
  onClose: function(){
      $('#open').prop('disabled',false);
      $('#close').prop('disabled',true);
  }      
});
$('#top').tabSlideOut({
  tabLocation: 'right',
  action: 'hover',
  handleOffsetReverse: true,
  offsetReverse: true,
  onLoadSlideOut: true
});
});

<script src="js/app.js" charset="utf-8"></script>

编辑:通过在创建Vue之后包含jQuery插件来解决,通过在Vue的创建方法中添加它来解决。

    created(){
        //...
        require('./jquery.tabSlideOut');
    }

0 个答案:

没有答案