在vue3的setup模式下，使用watch函数侦听id为box的div;box的宽高设置为100%，会因窗口放大或缩小而改变，当有变化时在控制台打印div的宽高

在Vue 3 的 `setup` 模式下，你可以使用 `ref` 来创建响应式的变量，并结合 `watch` 函数来监听元素尺寸的变化。假设我们有一个名为 `boxRef` 的 `ref` 对象，代表 id 为 "box" 的 div 元素：

import { ref, watch } from 'vue';

const boxRef = ref(null); // 初始化一个null的引用，用于包裹div

setup() {
  function handleResize() {
    if (boxRef.value) {
      const boxStyle = window.getComputedStyle(boxRef.value);
      console.log(`Div width: ${boxStyle.width}, Height: ${boxStyle.height}`);
    }
  }

  // 监听window的resize事件，检查boxRef是否已渲染并更新
  watch(() => boxRef.value, handleResize, { immediate: true }); // 使用immediate初始化立即触发回调

  // 如果你的 div 已经在 DOM 中，可以绑定到它的 resize 事件上
  document.addEventListener('resize', handleResize);

  return {
    boxRef
  };
}

在这个例子中，当你页面加载完成并且 `box` 的 div 渲染出来后，`handleResize` 函数会在每次窗口大小调整时被调用，打印出 div 当前的宽和高。