vue引入外部js时this指向vue

外部js默认情况下this指向的是浏览器本身， window;

以vue-element-admin为例：

//main.js
var vm = new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})
export default vm

//将vue实例赋值变量vm, 暴露vm

外部js导入vm

//xxx.js
import vm from "../main.js"

export function method() {
  console.log(vm)
}
//vm指向的就是vue

外部js导入到main全局使用

//main.js
import { method } from "xxx.js";
Vue.prototype.$method  = method;

这样的话就可以直接在template上调用方法；

<template>
  <div class="page" @click="$method"></div>
</template>

若你在页面methods调用的话，可以不用暴露vm直接使用this;

//xxx.js
export function method() {
  console.log(this)
}

在页面methods调用:

this.$method();