Vue基本语法2

vue绑定事件：

 1 <!DOCTYPE html>
 2 <html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 
 9 <div id="app">
10    <button v-on:click="sayHi">click me</button>
11 </div>
12 <!--1.导入Vue.js-->
13 <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
14 <script>
15     var vm = new Vue({
16         el:"#app",
17         data:{
18             message: "你好"
19         },
20         methods: {//方法必须定义在Vue的Method对象中,v-on:事件
21             sayHi: function () {
22                 alert(this.message);
23             }
24         }
25     })
26 </script>
27 </body>
28 </html>

 

posted @ 2022-08-04 17:01  doremi429  阅读(23)  评论(0)    收藏  举报