@opensig/opendesign/lib/hooks/use-screen.js

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const vue = require("vue");
const is = require("../_utils/is.js");
const global = require("../_utils/global.js");
const DEFAULT_SCREEN_SIZE = 0;
const useScreen = () => {
  const width = vue.ref(is.isClient ? window.innerWidth : DEFAULT_SCREEN_SIZE);
  const isPhoneSize = vue.computed(() => {
    if (is.isClient) {
      return width.value <= global.mediaPoint.value.phone;
    }
    return false;
  });
  const isPadSize = vue.computed(() => {
    if (is.isClient) {
      return width.value > global.mediaPoint.value.phone && width.value <= global.mediaPoint.value.pad;
    }
    return false;
  });
  const isPhonePad = vue.computed(() => {
    return is.isTouchDevice && (isPadSize.value || isPhoneSize.value);
  });
  const onResize = () => {
    width.value = window.innerWidth;
  };
  vue.onMounted(() => {
    window.addEventListener("resize", onResize);
  });
  vue.onUnmounted(() => {
    window.removeEventListener("resize", onResize);
  });
  return {
    isTouchDevice: is.isTouchDevice,
    isPhoneSize,
    isPadSize,
    isPhonePad
  };
};
exports.useScreen = useScreen;