[TOC] # 綁定事件 使用 v-on指令綁定事件 >格式： v-on：事件名=“響應事件的函數” ***** **注意** >v-on:可以省略為@ <br> ### 選項卡例子（tab欄） ``` <div id="app1"> <!-- 給button綁定點擊事件 --> <!-- v-on:可省略為@ --> <button v-on:click = "handleClick(1)">選項1</button> <button @click = "handleClick(2)">選項2</button> <button @click = "handleClick(3)">選項3</button> <p v-show = "num ==1">選項1內容</p> <p v-show = "num == 2">選項2內容</p> <p v-show = "num == 3">選項3內容</p> </div> <script> new Vue({ el:'#app1',//定義范圍 data:{//定義變量 num :1//定義個變量，給點擊事件做判斷，同時顯示相應的內容 }, methods:{//定義方法 handleClick:function(num1){//形參 // this指的是vue實例化的對象 this.num = num1; } } }) </script> ```