修改高度

src/managements/components/layouts/index.jsx

@@ -1,6 +1,7 @@
 import React, { useState, useEffect, Fragment } from "react";
 import { Link } from "react-router-dom";
 import { Menu } from "antd";
+import { main_web_site_url } from '../../fetch';
 import "./index.scss";
 const { SubMenu } = Menu;
 
@@ -21,19 +22,19 @@ export default (props) => {
 
   function titleFun(menus) {
     menus.forEach(i => {
-      if(i.hidden === 1){
+      if (i.hidden === 1) {
         titleObj[i.key] = i.title;
         locationObj[i.location] = i;
         i.key = i.key + '';
         i.parentKey = i.parentKey + '';
         i.location && allRouter.push(i.location);
-        i.parentKey=='0' && rootSubmenuKeys.push(i.key);
+        i.parentKey == '0' && rootSubmenuKeys.push(i.key);
         if (i.hidden === 1 && Array.isArray(i.children) && i.children.length > 0) {
           titleFun(i.children);
           i.parentKey && (parentKeyObj[i.key] = i.parentKey + '');
         }
       }
-      
+
     })
   }
 
@@ -43,6 +44,10 @@ export default (props) => {
     sessionStorage.setItem("current_user", JSON.stringify(current_user));
   }, [current_user.login]);
 
+  useEffect(() => {
+
+  }, [])
+
 
   useEffect(() => {
     if (locationObj[pathname]) {
@@ -64,16 +69,17 @@ export default (props) => {
   }
 
   function itemClick(item) {
-    let myIframe=document.getElementById("iframe");
-    if(myIframe){
-      myIframe.height='auto';
+    console.log(111);
+    let myIframe = document.getElementById("iframe");
+    if (myIframe) {
+      myIframe.height = 'auto';
     }
     setActive(item)
   }
 
   function getMenuList(menus) {
     return menus.map(function (item) {
-      if(item.hidden === 1){
+      if (item.hidden === 1) {
         let title = (
           <span>
             {item.icon && <i className={"left-icon iconfont " + item.icon}></i>}
@@ -104,10 +110,10 @@ export default (props) => {
 
   function iframeLoad() {
     try {
-      let myIframe=document.getElementById("iframe");
-      if(myIframe.contentDocument){
-        myIframe.height = myIframe.contentDocument.querySelector('.content').clientHeight +60;
-        myIframe.contentDocument.querySelector('.admin-body-container').style.overflow='hidden';
+      let myIframe = document.getElementById("iframe");
+      if (myIframe.contentDocument) {
+        myIframe.height = myIframe.contentDocument.querySelector('.content').clientHeight + 60;
+        myIframe.contentDocument.querySelector('.admin-body-container').style.overflow = 'hidden';
       }
     } catch (err) {
       console.error(err);
@@ -134,6 +140,20 @@ export default (props) => {
     })
   }, [history]);
 
+
+  useEffect(() => {
+    window.addEventListener("message", iframeHeight, false);
+    return () => {
+      window.removeEventListener("message", iframeHeight, false);
+    }
+  }, []);
+
+  function iframeHeight(e) {
+    if (e.origin === main_web_site_url && e.data && !isNaN(e.data)) {
+      document.getElementById("iframe").height=Number(e.data);
+    }
+  }
+
   return (
     <Fragment>
       <div className="layouts">
@@ -150,7 +170,7 @@ export default (props) => {
       <div className="managements">
         <div className="head-title">{head(keyPath)}</div>
         {acitve && acitve.urlType && acitve.urlType !== 'self' ?
-          <iframe id="iframe" className="iframe-item" src={`${setting[acitve.urlType]}${acitve.location && acitve.location.startsWith('/administration') ? acitve.location.replace(/\/administration/, "") : acitve.location}?${acitve.params||'layout=none'}`} onLoad={iframeLoad}></iframe>
+          <iframe id="iframe" className="iframe-item" src={`${setting[acitve.urlType]}${acitve.location && acitve.location.startsWith('/administration') ? acitve.location.replace(/\/administration/, "") : acitve.location}?${acitve.params || 'layout=none'}`} onLoad={iframeLoad}></iframe>
           : children
         }
       </div>