Reactjs 反应检查事件是否在未使用Ref的情况下冒泡/捕获

这是使用REF的解决方案

import React, { useState, useRef } from "react";

function Bar() {
    const ref = useRef();
    return (
            <div
               ref={ref}
               onClick={(ev) => {
                  if (ev.target == ref.current) console.log("Target hit");
                }}
             >
              Click me, maybe <div>test</div>
            </div>
     );
}

import React，{useState，useRef}来自“React”；
功能条（）{
const ref=useRef（）；
返回(
{
如果（ev.target==ref.current）console.log（“目标命中”）；
}}
>
点击我，也许是测试
);
}

在上面的解决方案中，当我们点击test时，目标并没有命中。我们可以吗 不使用REF获得相同的输出

---

使用事件的

currentTarget

属性，它将始终引用它注册的元素，而不是触发它的元素

target

：

function Bar() {
    return (
            <div
               onClick={(ev) => {
                  if (ev.target === ev.currentTarget) console.log("Target hit");
                }}
             >
              Click me, maybe <div>test</div>
            </div>
     );
}

功能条（）{
返回(
{
if（ev.target==ev.currentTarget）console.log（“目标命中”）；
}}
>
点击我，也许是测试
);
}