我试图让地图响应我的网站，因此我添加了 if 语句，但它不起作用，宽度只有在我手动编辑时才会改变。有人可以帮忙吗？我一直在尝试解决这个问题，但我只是不明白为什么它不起作用

let phone = "320";
let tablet = "900";
let bigScreen = "2600";
let bigLaptop = "1400";
let laptop = "1000";
function useWindowSize() {
  const [width, setWidth] = useState(calculateWidth());
  useEffect(() => {
    function updateSize() {
      console.log("hey");
      setWidth(calculateWidth());
    }

    window.addEventListener("resize", updateSize);

    return () => {
      console.log();
      window.removeEventListener("resize", updateSize);
    };
  }, []);

  function calculateWidth() {
    if (window.innerWidth < bigScreen && window.innerWidth > bigLaptop) {
      return "70vw";
    } else if (window.innerWidth < bigLaptop && window.innerWidth > laptop) {
      return "67vw";
    } else if (window.innerWidth < laptop && window.innerWidth > phone) {
      return "60vw";
    } else {
      return "100vw";
    }
  }
  return width;
}

//For map API location Bali
export function Map() {
  const mediaWidth = useWindowSize();
  console.log();
  const [viewport, setViewport] = useState({
    latitude: -8.340539,
    longitude: 115.091949,
    width: mediaWidth,
    height: "100vh",
    zoom: 10,
  });