如何从Vue.js中的组件生命周期方法访问mixin方法中的函数

Question

这是一个例子:

mixin.js

export default {
    methods : {
        aFunction() { // Some functionality here }
    }
}

component.vue

import mixin from './mixin'
export default {
    mixins : [ mixin ]
    created() {
        // Call aFunction defined in the mixin here
    }
}

我想从组件内部的created()生命周期方法访问mixin方法中定义的aFunction.

Answer 1

mixin方法与组件的当前实例合并,因此它只是:

created(){
  this.aFunction()
}

这是一个例子.

console.clear()

const mixin = {
  methods:{
    aFunction(){
      console.log("called aFunction")
    }
  }
}

new Vue({
  mixins:[mixin],
  created(){
    this.aFunction()
  }
})

<script src="https://unpkg.com/vue@2.4.2"></script>