usewindowsize 封装窗口尺寸响应式状态，返回 width 和 height 两个 ref，通过 onmounted/onunmounted 管理 resize 监听，兼容 ssr，类型明确，接口简洁。
直接封装成 useWindowSize 就行，核心是把窗口尺寸的响应式状态和监听逻辑打包好，只暴露 width 和 height 两个 ref。
命名和文件位置要规范
函数名必须以 use 开头，比如 useWindowSize；建议单独建文件，路径如 src/composables/useWindowSize.ts 或 src/hooks/useWindowSize.ts，方便后续统一管理。
用 ref 存尺寸，用 onMounted/onUnmounted 控制监听
窗口宽高是基础类型，适合用 ref；初始化要读取当前值，挂载时加 resize 监听，卸载时务必移除，否则容易内存泄漏。
- 判断
window是否存在，避免 SSR 环境报错 -
handleResize函数里直接更新width.value和height.value - 挂载后立即调用一次
handleResize，确保初始值准确
返回值只暴露组件真正需要的东西
不用返回事件函数或清理方法，外部只需要 width 和 height 这两个响应式引用。其他逻辑全在 Hook 内部闭环处理。
- 类型定义推荐写清楚，比如
{ width: Ref<number>; height: Ref<number> }</number></number> - 如果项目用 TypeScript，导出函数时加上类型断言或接口，提升 IDE 提示体验
- 不返回原始 window 对象或事件监听器，保持接口干净
在组件里用起来很简单
引入后解构即可，后续还能配合 computed 做响应式判断，比如判断是否移动端。
const { width, height } = useWindowSize()const isMobile = computed(() => width.value- 模板中直接
{{ width }}或v-if="isMobile"
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
