Przeglądaj źródła

上传文件至 'src/mobile'

deng 1 rok temu
rodzic
commit
0fcb881666
2 zmienionych plików z 60 dodań i 0 usunięć
  1. 46 0
      src/mobile/Layout.js
  2. 14 0
      src/mobile/Mobile.js

+ 46 - 0
src/mobile/Layout.js

@@ -0,0 +1,46 @@
+/* eslint-disable import/no-anonymous-default-export */
+import React, { useEffect, useState } from "react";
+import Menu from "./component/Menu";
+import Footer from "./component/Footer";
+import "../index.css"
+
+const Layout = (props) => {
+  const { children, } = props;
+  const [width, setwidth] = useState();
+  useEffect(() => {
+    window.addEventListener("orientationchange", handleOrientationChange, true);
+    getWidth();
+    return () => {
+      window.removeEventListener("orientationchange", handleOrientationChange)
+    }
+  });
+  const handleOrientationChange = () => {
+    // const height = (document.documentElement.clientHeight - 30) * 1.695 - 29;
+    getWidth();
+  }
+  const getWidth = () => {
+    const width = document.documentElement.clientWidth;
+    setwidth(width);
+  }
+  return (
+    <Menu>
+      <div
+        style={{
+          position: "absolute",
+          top: -40,
+          background: "white",
+          minHeight: "100vh"
+        }}
+      >
+        <div className="mobile_main" style={{
+          width
+        }}>
+          {children}
+        </div>
+        <Footer style={{ marginTop: 10 }} />
+      </div>
+    </Menu>
+  );
+};
+
+export default Layout;

+ 14 - 0
src/mobile/Mobile.js

@@ -0,0 +1,14 @@
+import React from "react";
+import Layout from "./Layout";
+
+
+const Mobile = () => {
+ 
+  return (
+    <Layout>
+      
+    </Layout>
+  )
+};
+
+export default Mobile;