Javascript 如何从vue应用程序外部调用/初始化vue方法

我有一个应用程序，安装在一个现有网站的页面上。为了初始化应用程序，我在Vue应用程序中有一个按钮来切换/启动实际的Vue逻辑

这一切都是非常直接的，一个按钮出现在页面上，点击它，应用程序的逻辑和方法都变得栩栩如生

<template>
  <button @click.prevent="toggle">Click me</button>
</template>
<script>

export default {
  computed: {
    isBurgerActive() {
        return this.$store.getters.getIsNavOpen;
    }
  },
  methods: {
    toggle() { <----- CALL THIS METHOD OUTSIDE OF VUE
      this.$store.dispatch('toggleNav');
      this.$store.dispatch('getProduct');
    }
  }    
}
</script>

点击我
导出默认值{
计算：{
是主动的（）{
返回此项。$store.getters.getIsNavOpen；
}
},
方法：{
toggle（）{如果将组件分配给变量。可以调用该变量上的方法。事实上，可以从该变量访问vue的其他属性（例如：refs，data）

试试下面的狙击手：


var-app=新的Vue({
el:“应用程序”，
数据（）{
返回{
I：错，
}
},
计算：{
是主动的（）{
返回此项。isActive？'active'：'inactive'
}
},
方法：{
切换（）{
this.isActive=！this.isActive；
}
},
})
document.getElementById（'btn'）。addEventListener（“单击”，函数（）{
app.toggle（）；
})

点击我
活动：{{isBurgerActive}
那么你想在Vue空间中单击一个按钮来启动应用程序？我不明白，你为什么还要大喊大叫？为了更好的上下文，但现在那里很好，很冷。是的，你想在Vue应用程序逻辑之外有一个单击按钮，它只是启动Vue应用程序。目前，页面加载，然后Vue需要加载按钮来启动应用程序启动切换方法。例如进入Vue并从Vue外部调用方法。不确定这是否可行。我假设这与我想要的内容密切相关，但我使用的是Vue CLI。他们使用的是Vue CDNstep 1：第一页只有一个按钮，没有加载js或Vue。步骤2：单击该按钮，启动Vue并点击其中一个按钮帽子函数。我说的对吗？有JS，但Vue作为应用加载到id=“APP”该页面为普通HTML、CSS、JS。尝试使用普通JS触发切换并启动appVue只在Vue CLI应用程序中，而不在文档页面上。因此我不确定这是否有效，您正在使用Vue CDN。尽管我可以尝试。如果生成CLI，您可以尝试在vue初始化
var app=new vue（{router，store，…}）
。