在Vue中如何不处理内部元素触发的事件？

方法一 事件修饰符.self

 <div class="mask" @click.self="close">
    <div class="mask-content"></div>
  </div>

方法二 事件修饰符.stop

 <div class="mask" @click="close">
      <!-- 用一个空方法，响应点击内容区域的事件，并且阻止事件传递给父元素 -->
    <div class="mask-content" @click.stop="noAction"></div>
  </div>

方法三 event.target

 <div class="mask" @click="close">
    <div class="mask-content"></div>
  </div>

    close() {
      let target = event.target;
      if (target.className === "mask") {
        console.log("点击关闭");
      }
    },