vue3监听窗口变化来进行页面操作

当需要监听窗口的宽度变化来对页面进行dom隐藏或修改时，操作如下

const timer = ref(false);

// 视口宽度
const vieWidth = ref(
  document.documentElement.clientWidth || document.body.clientWidth
);
//监听并更新视口宽度
watch(
  (vieWidth.value = () => {
    // 为了避免频繁触发导致页面卡顿，使用定时器
    if (!timer.value) {
      vieWidth.value = document.body.clientWidth;
      timer.value = true;
      setTimeout(function () {
        timer.value = false;
      }, 200);
    }
  })
);

视口宽度就可以获取到了，直接用vieWith的值就可以来判断dom的隐藏或修改啦