如何在vue-cli 3.x中使用jquery

由於項目需求要使用jquery，結果各種引用都不濟於事。

最后在網上找到了答案，現把它記錄一下，給有需要者。

首先下載 jquery。

cnpm install  jquery --save-dev

方案一：

然后在main.js中引入jquery。

import Vue from 'vue'
import $ from 'jquery'  //加上這句話
import App from './App.vue'
 
Vue.config.productionTip = false   
Vue.prototype.$ = $;   // 當然還有這句話 給vue原型上添加 $ 
new Vue({
  render: h => h(App),
}).$mount('#app')

在使用的時候

mounted() {
  console.log(this.$('#wrapper'));      
}

這樣使用的時候會有一些麻煩，比如在一個函數內部使用的時候，this的指向是個問題。

方案二：

這個就比較簡單粗暴了，直接在需要使用jquery的組建中

<script>
import $ from 'jquery'
export default {
  // $("nav").click()
  ...
}

mrceel.cn