lit-html - lit-html：如何只听点击源元素而不是子元素

Question

我有一个模板：

        <button 
        data-action="acknowledge"
        @click="${setCommentStatus}"
        type="button" 
        class="btn">
            <span class="text-dark">
              <i class="icon-foobar"></i>Foobar
            </span>
        </button>

问题是，当单击子元素时，它们会触发 setCommentStatus 函数，有没有办法只在单击具有 setCommentStatus 函数的实际元素而不是子元素时进行监听。

const setCommentStatus = {
  handleEvent(e) {
    const action = e.target.getAttribute('data-action');
    console.log('action', action);
  },
  capture: true
};

Answer 1

可以通过使用 e.currentTarget 而不是 e.target 来实现

const action = e.currentTarget.getAttribute('data-action');
console.log('action', action);