美文网首页
$event理解

$event理解

作者: 璃安_ | 来源:发表于2022-11-05 18:15 被阅读0次
  • $event是指当前触发的是什么事件(鼠标事件,键盘事件等)

  • $event.target则指的是事件触发的目标,即哪一个元素触发了事件,这将直接获取该dom元素

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 引入库文件 -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</head>

<body>
    <div id="app">
        <p>count的值为{{count}}</p>
        <input type="button" value="按钮" @click="add($event,1)">
    </div>

    <script>
        // 创建实例对象
        const app = new Vue({
            el: '#app',
            data: {
                count: 1
            },
            methods: {
                add (e, a) {
                    console.log(e, a);
                    this.count += a
                    console.log(this.count);


                    if (this.count % 2 === 0) {
                        e.target.style.backgroundColor = 'pink'
                    } else {
                        e.target.style.backgroundColor = 'skyblue'

                    }
                }
            }
        })
    </script>
</body>

</html>
image.png
image.png
image.png

相关文章

  • 理解Event Loop

    官方文档:The Node.js Event Loop, Timers, and process.nextTick...

  • js引擎的执行机制

    js引擎的执行机制 JS的Event Loop是JS的执行机制,理解JS的执行,必须理解Event Loop JS...

  • Event Loop浅理解

    event loop task queue中取任务 同步任务立即执行 异步任务挂起来,可以执行时放入task qu...

  • 事件简单理解

    事件简单理解 1、event 和 delegate 的关系就好像字段和属性的关系 2、event 会限制 dele...

  • Event loop

    为什么要了解Event loop?理解Event loop,对于浏览器(或者nodejs)处理事件的过程会有更透彻...

  • DOM Event:终止事件流动

    阅读本文需要理解事件流动机制,可以查阅之前的DOM Event:事件流动(Event Flow)。 我们知道一个事...

  • (五 交互-1)PyQT5 绑定函数的传参

    理解说明 如下内容很好,建议阅读。A PyQt button event can be connected in ...

  • 11:11事件:有人理解吗?

    11:11事件:有人理解吗? THE 11:11 EVENT: DID ANYONE UNDERSTAND THI...

  • 理解Event的冒泡模型

    本文探索一下Event的冒泡过程和初学遇到的几个小bug DOM Event概述 Event接口是检测在DOM中的...

  • 白话 event loop的理解

    event loop ? microtask ? macrotask ? 不好意思,我记不住,关于这方面的解释以及...

网友评论

      本文标题:$event理解

      本文链接:https://www.haomeiwen.com/subject/awjvtdtx.html