如何从vue应用程序外部调用/初始化Vue方法
从vue应用程序外部调用/初始化Vue方法有多种方式，下面是一种常见的方法：
- 在HTML文件中引入Vue库文件。你可以从Vue官网下载最新版本的Vue.js文件，然后在HTML文件的
<head>标签中使用<script>标签引入Vue.js文件。
<script src="vue.js"></script>- 在外部JavaScript文件中编写Vue代码。创建一个新的JavaScript文件，比如
main.js，在该文件中编写Vue的代码。例如，创建一个新的Vue实例并将其挂载到一个HTML元素上。
// main.js
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
},
methods: {
sayHello: function () {
alert(this.message);
}
}
});- 在HTML文件中使用
<script>标签引入外部JavaScript文件。在HTML文件中使用<script>标签引入main.js文件。
<script src="main.js"></script>- 在HTML中添加调用Vue方法的按钮或其他触发事件。通过HTML中的按钮或其他触发事件，调用Vue实例中的方法。
<div id="app">
<button @click="sayHello">Click Me</button>
</div>这样，当点击按钮时，Vue实例中的sayHello方法会被调用，弹出一个包含message的对话框。
以上是一种常见的从Vue应用程序外部调用/初始化Vue方法的方法。注意，Vue有更多高级的用法和功能，可以根据具体需求进行进一步学习和应用。另外，关于Vue的更多详细信息和使用示例，可以参考腾讯云的Vue.js产品介绍页面：Vue.js产品介绍。
相关·内容
我有一个应用程序是安装在一个预先存在的网站页面。为了初始化应用程序，我在Vue应用程序中有一个按钮来切换/启动实际的Vue逻辑。这一切都很简单，页面上出现一个按钮，点击它，应用程序的逻辑和方法都变得生动起来。store.getters.getIsNavOpen; }, toggle() { <----- CALL THIS METHOD OUTSIDE OF VUE$s
浏览 49提问于2020-01-30得票数 0
当使用带有singlefile组件的类型记录时，我很难从Vue应用程序外部调整数据。
import Vue from 'vue';
浏览 1提问于2019-07-21得票数 0
回答已采纳
请解释使用Vue构建一页网站(页面路由)和使用Vue构建电子应用程序的不同Vue安装方法的主要区别是什么：
这个并不能真正帮助理解两者之间的区别如果我只是通过<script>导入Vue，我的站点/应用程序会运行得更慢吗？
浏览 1提问于2017-12-18得票数 5
回答已采纳
我有一个项目，在该项目中，我使用new Vue()从main.js中使用#app.mounted初始化了#app.mounted。
此后，我将来自每个组件的所有路由器视图注入应用程序。现在，我想的是我应该在每个组件中调用new Vue()，而不是从一个中央main.js文件中调用。我想问的是，这种调用/导入Vue并从每个文件初始化的方法是否是一个好方法，还是应该坚持从一个
浏览 4提问于2017-11-08得票数 2
回答已采纳
1回答
是否可以在运行时在Vue中运行一些外部JS代码？例如，我有一些逻辑可以在运行时由本地管理员修改，而不必重新加载整个应用程序，该应用程序作为JS代码块存储在数据库中，并可通过后端通过axios调用进行访问。result = scriptService.executeScript( script, params ); //execute script with given params
我有类似的Java应用程序方法，可以在运行时执行存储的Groovy脚
浏览 3提问于2021-01-09得票数 0
2回答
我们使用Vue.js实现弹出函数。Vue App中的"Click“按钮将正确启动弹出窗口，但是当我从外部调用时，弹出窗口外部的vueApp.methods.openModal() /调用将不会出现，尽管函数调用本身是可能的。此外，在像这样从外部调用方法时，如何使v-show正常工作？(lessonScheduleEdit).mount(&quo
浏览 4提问于2022-01-03得票数 1
回答已采纳
如何在Vue js中从外部javascript触发'methode‘内的函数？ 我想在vue js中从index.html触发方法内部的调用()。 有人能帮我解决这个问题吗？
浏览 18提问于2020-04-23得票数 0
我的主要问题是，我试图被动地将数据添加到Vue根或Vue组件。出现这个问题的原因是，一旦我的Vue应用程序实例被挂载(使用app.mount())，我就无法向Vue应用程序中主动添加数据。我正在尝试使用Vue和vanilla JS，因为我是这个框架的新手。我想真正归结起来的是...有没有什么事件可以触发，或者可以在普通JS中调用对象，以便将新数据插入到Vue应用程序实例中的对象数组中？
浏览 0提问于2021-12-02得票数 1
那么，如果我在Vue的main.js中使用window.app而不是const应用程序，有什么不同？ import question from './components/Questions.vue';
window.Appapp = new Vue({
浏览 173提问于2021-01-28得票数 3
回答已采纳
使用Vuejs/Laravel .I，使用这个简单的javascript代码生成刀片中的图表。 function getData(columnOrder, keyName) { table.find('tbody tr').each(function() { rows.each(fu
浏览 0提问于2018-12-28得票数 0
回答已采纳
我有一个使用vue-i18n的typescript Vue.js应用程序，我想把它移植到Nuxt.js上。在Vue.js应用程序中，我通过调用以下方法在文件中初始化了i18nconst i18n = new VueI18n({locale: 'ja', // set locale
messages,
浏览 97提问于2020-03-12得票数 3
我正在学习Vue，并且看到了许多不同的示例应用程序、文档和“如何- to”。人们初始化组件并将它们安装到应用程序中似乎有很多不同的方式。const app = new Vue({ data: function(){});export default { data() {
浏览 1提问于2021-11-18得票数 0
我找到了一个关于如何使用Vue路由器的很好的例子。下面是app.js文件：Vue.use(VueRouter)
router.map({ &#
浏览 4提问于2015-09-24得票数 1
回答已采纳
我需要从我的应用程序外部调用一个方法。我用的是Vue CLI。我的方法在一个组件中，如下所示： name: 'home', theMethodINeedToCall() { }我一直在寻找一种访问theMethodINeedToCall()的方法当您不使用Vue CLI时，实现
浏览 0提问于2017-12-16得票数 2
回答已采纳
1回答
我正在尝试在一个不使用Vue的现有项目中安装。但是，我找不到任何资源或文档，说明如何编写具有API的Vue组件，这些API可供Vue世界以外的代码使用。所有的东西都是用Vue自上而下构建的应用程序。@2.5.8/dist/vue.js"></script>
我只是随便玩一下就知道了：
从Vue
浏览 5提问于2017-11-22得票数 1
我有一个Vue项目，在其中我创建了一个新的、普通的TypeScript文件Validation.tsimport BaseInput from '@/components=> field.validate()).every(Boolean);}
我的类BaseInput有公共方法validate() (我可以在其他Vue组
浏览 4提问于2020-09-17得票数 3
回答已采纳
我正试着在我的Vue应用中设置Vuex。require('./bootstrap');
Vue.use(Vuex); storeData
Vue.com
浏览 1提问于2021-11-14得票数 0
我在SPA模式下的Nuxt.js应用程序中使用Google Maps API，我希望从gmap click事件调用Vue.js方法中的函数 我尝试了通常的this.createInfoWindow()在我的组件中，我初始化了google地图，并在安装的vue中添加了click事件： async mounted() { const google = await方法中，我有一个函数： m
浏览 14提问于2019-04-17得票数 1
回答已采纳
1回答
我使用Vue 2，vue-test-utils，jestVue.use(Croppa, { componentName: 'image-croppa' })脚本 return { }此外
浏览 2提问于2018-03-01得票数 5
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
