如何从外部 JavaScript 文件调用 Vue.js function？

Question

我必须从外部 JavaScript 文件调用 Vue.js function，但它不起作用。 下面我给出了我尝试过的代码。

// external js file 
import vm from './vue.js';

function callingVuejsFunction(data) {  
    this.vm.displayData()
}

// Vuejs file
var vm = new Vue({
    el: '#app',
    data: {
        firstname : '' ,
        lastname  :  ''
    },
    methods:{
        displayData: function( ) {
            alert()
        } 
    } 
})

Answer 1

您可以使用vm.$options.methods.displayData() ：

 var vm = new Vue({ el: '#app', data: { firstname: '', lastname: '' }, methods: { displayData: function(msg) { alert(msg) } } }) vm.$options.methods.displayData('I was called externally!')

 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"></div>

Answer 2

 export default { methods:{ my_function(){ alert('vue function trigger,.,') } }. created () { let _this = this window.addEventListener('ready', function() { _this.my_function() }) } }

这是从 javascript 调用 vue 方法的完美示例。