pointer-events“穿透”点击并保证上层的元素也可点击

想要点击btn1但是btn1被上层box挡住，设置box {pointer-events: none;} 后点击box穿透到下层即可捕捉btn1的点击事件，同时点击box上的btn2也会穿透，无法捕捉到btn2的点击事件，想要捕捉btn2的点击事件给他加{pointer-events: all}就可以了- -

 <div class="content">
     <button class="btn1" @click="click1">1111</button>
      <div class="box">
          <button class="btn2"  @click="click2">2222</button>
      </div>
  </div>
  .content{
  position: relative;
  width: 100vw;
  height: 100vh;
}
.box{
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;//值none表示鼠标事件“穿透”该元素并且指定该元素“下面”的任何东西。
}
.btn2{
  pointer-events: all;//使元素成为鼠标事件的目标
}