vue項目中如何在外部js中例如utils.js直接調用vue實例及vue上掛在的方法

一般我們都是在main.js中引入vue，然后在vue文件中直接使用this（this指向的是vue實例），但是在實際開發中，我們往往會引入外部的js文件使用this，這個this就會指向window，並不是我們期待的vue實例，那么就需要重新引入vue文件（import Vue from 'vue'）,這樣很麻煩。在目前項目中我使用的方法是mian.js導出vue實例，然后在需要使用的js中引入。

 

步驟一：main.js導出vue實例

let vueMain = new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

export default vueMain

步驟二、在需要使用vue的js中引入

import vueMain from '@/main.js'

vueMain.$router.push({
   path: '/login' 
})