在Vue中声明函数有以下两种方式:
在Vue实例中直接声明
可以在Vue实例的methods中声明函数,例如:
var vm = new Vue({ el: '#app', data: { message: 'Hello Vue!' }, methods: { showMessage: function () { alert(this.message) } } })
在上面的代码中,我们在methods中声明了一个showMessage函数,它会弹出一个警告框,显示message的值。
在组件中声明
可以在Vue组件中声明函数,例如:
Vue.component('my-component', { template: '<button @click="showMessage">Click me</button>', data: function () { return { message: 'Hello Vue!' } }, methods: { showMessage: function () { alert(this.message) } } })
在上面的代码中,我们在my-component组件中声明了一个showMessage函数,它会弹出一个警告框,显示message的值。在组件模板中,我们通过@click指令将showMessage函数绑定到按钮的点击事件上。