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

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

// 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()
        } 
    } 
})

---

您可以使用

vm.$options.methods.displayData（）

：

var vm=new Vue({
el:“#应用程序”，
数据：{
名字：''，
姓氏：“”
},
方法：{
displayData:函数（msg）{
警报（msg）
}
}
})
vm.$options.methods.displayData（'I被外部调用！'）

尝试

vm.displayData（）

而不是

this.vm.displayData（）

它没有调用。您需要的是对Vue应用程序的引用，而不是对Vue框架本身的引用。更改Vue应用程序中的

main.js

，使其将根Vue实例分配给全局变量（例如

window.myApp

），然后在外部脚本中引用此变量。