Vue在对鼠标进行监听时当有弹出窗出现时鼠标的监听事件无法继续进行

Vue在对鼠标进行监听时当有弹出窗出现时鼠标的监听事件无法继续进行

<template>
  <div id="app" @click="moveEvent" @mousemove="moveEvent">
    <router-view />
  </div>
</template>

<script>
export default {
  name: "app",
  data() {
    return {
    };
  },
  watch: {
  },
  created() {},
  methods: {
    moveEvent() {
      let mouseStopTime = new Date().getTime();
      window.sessionStorage.setItem(
        "mouseStopTime",
        JSON.stringify(mouseStopTime)
      );
      console.log(JSON.parse(sessionStorage.getItem("mouseStopTime")));
    },
  },
  computed: {},
};
</script>
<style lang="scss">
#app {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.pdf-container {
  background: #dddddd;
}
.pdf-dialog {
  .el-dialog {
    height: 100%;
  }
  .el-dialog__body {
    height: calc(100% - 170px);
    overflow-y: auto;
  }
}
</style>

弹出框是用avue-crud实现的，会有一个遮罩层，该如何做出调整才能监听到弹出窗中的鼠标点击和移动事件并且不影响弹出框的功能

可以在弹出层添加一下 pointer-events: none;试试

应该是 谈弹出框 有遮罩层 设置了 z-index的原因 可能是鼠标 穿透
https://blog.csdn.net/qq_45723621/article/details/125207695

可以改用document来监听操作：

document.onmousemove =function (ev) {
      console.info('move');
    }

感觉不是鼠标的监听事件无法继续进行啊，而是弹出框弹出后mouseStopTime 这个时间没有刷新啊