javascript - vue中如何使用mobiscroll插件

問題描述

項目中需要將以前的jquery換成vue實現，之前的代碼使用mobiscroll實現的，現在把之前的插件js都放在了index.html下面了，但是在首頁卻總是報Error in mounted hook: 'ReferenceError: mobiscroll is not defined'。是該插件不支持vue嗎？總是報mobiscroll這個方法不存在，我用webstrom確實能點到插件里面的，所以依賴不是問題。js插件是放在index.html下引入的，沒有用npm報錯代碼是：initPage(){

var currYear = (new Date()).getFullYear();mobiscroll.settings$(’#dataTime’).mobiscroll().date({ theme : 'android-holo', mode : 'scroller', display : 'bottom', lang : 'zh', dateFormat : ’yyyy-mm-dd’, defaultValue : new Date(new Date().setFullYear(currYear - 30)), startYear : currYear - 70, endYear : currYear + 10});$('.checkbox-span').click(function() { var idname = $(this).attr('id'); console.log(idname) if (idname == 'xz-checkbox') { $(this).removeAttr('id'); $('.main-btn').attr('disabled', 'disabled'); $('.main-btn').css('background', '#CCCCCC'); } else { $(this).attr('id', 'xz-checkbox'); $('.main-btn').removeAttr('disabled'); $('.main-btn').css('background', ''); }})$('.radio-p').click(function() { $('.radio-p').removeAttr('id'); $('.radio-span').html(''); $(this).attr('id', 'xz-radio-p'); $(this).children('.radio-span').html('<span></span>') $('#userinfo').find('input[name=’sex’]').val($(this).data('sex'));}) },

問題解答

npm install exports-loader //下載webpack loader插件

將mobiscroll插件（包括css）放在common下的js文件夾中

在需要調用Mobiscroll的組件中調用

require(’exports?$=jQuery!../../Common/js/mobiscroll.js’)