事件

2020-10-30  本文已影响0人  lucky_yao
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vue事件</title>
</head>
<body>

    <div id="app">

        <button @click="fn($event,'你好')">点我啊</button>

    </div>
    

    <script src="js/vue.js"></script>

    <script>
        /*
        事件:  满足某种条件后,触发的指定功能
            指令 v-on:  简写 @   
            v-on:事件名称.修饰符 = "执行的函数或者表达式"

          this:
                vue中 methods中的this, 永远指向vue实例对象

          事件对象:
                 1. 如果有其他参数的时候,需要传递实参$event
                 2. 如果没有其他参数,默认为第一个参数
        */
        let app = new Vue({
            el:'#app',
            data:{
                val:1
            },
            methods:{
                fn(e,v){
                    console.log(this.val);
                    this.fn2();
                    console.log(v);
                    console.log(e);
                },
                fn2(){
                    console.log("我是嵌套调用的");
                }

            }
        });

    </script>
</body>
</html>
上一篇 下一篇

猜你喜欢

热点阅读