06.v-on引數問題

<body>
    <div id="app">
        <!-- 事件呼叫的方法沒有引數 小括號可以省略 -->
        <button @click="btnClick()">導航1</button>
        <button @click="btnClick">導航2</button>

        <!-- 在事件定義時。寫方法時省略小括號  但是方法本身需要一個引數  
            這時候 Vue會預設把瀏覽器生成的event事件物件 傳入方法 -->
        <button @click="btnClick2">導航3</button>

        <!-- 定義方法時 需要event物件 也需要傳其他引數  直接寫 event會報錯 因為會被以為時一個變數
        去data裡面找 沒找到定義的變數就報錯了  所以要傳event物件 應該在在前面加$  $event  
-->
        <button @click="btnClick3(abc,$event)">導航4</button>

        <!-- 或者形參和實參 都寫一個引數 列印的時候寫形參 和 event 也可以得到event物件和實參 -->
        <button @click="btnClick5(abc)">導航5</button>
    </div>
    <script src='https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js'></script>
    <script>
        const app  
= new Vue({
            el: '#app',
            data: {
                abc: "李銀河~你好啊"
            },
            methods: {
                btnClick() {
                    console.log("click");
                },
                btnClick2(num) {
                    console.log("-------", num);
                },
                btnClick3(abc, event) {
                    console.log( 
"+++++", abc, event);
                },
                btnClick5(abc) {
                    console.log("~~~~~~", abc, event);
                }
            }
        })
    </script>
</body>

06.v-on引數問題

06-v-on的基本使用

06.v-on指令基礎

06.v-on的修飾符

聊聊vue 中的v-on引數問題

vue v-on引數傳遞

vue v-on:click傳遞動態引數的步驟

vue中v-on的使用，引數，修飾符

12 小程式-計算屬性-塊級作用域-v-on/I/for/if引數-過濾器

v-on的引數問題與修飾符

v-on的補充說明—事件引數的傳遞

vue中使用v-on繫結一個方法的引數傳遞問題

關於vue3預設把所有onSomething當作v-on事件繫結的思考

00、Vue概述、HelloWorld程式、Mustache語法、v-html、v-on:click、v-for、v-bind動態繫結屬性、v-bind語法糖）

v-bind v-on 縮寫

詳解vue中v-on事件監聽指令的基本用法

vue中使用v-bind="$attrs"和v-on="$listeners"進行多層元件通訊

VUE事件處理 v-on

vue.js中 v-for,v-on,v-model,結合應用案例---記事本

17.v-on可以監聽多個方法嗎

06.v-on引數問題

相關推薦