Przeglądaj źródła

Merge branch 'dev5.3.1' into dev/new1

zhangxc 5 lat temu
rodzic
commit
f5ee329bd7

+ 29 - 0
src/components/Treat/NewPortal/index.jsx

@@ -0,0 +1,29 @@
+import React, { Component } from 'react';
+import ReactDOM from 'react-dom';
+
+//传送门,将dom渲染到body节点
+class NewPortal extends Component {
+    constructor(props) {
+        super(props)
+        // 初始化创建渲染的父元素并添加到body下
+        this.node = document.createElement('div');
+    }
+
+    componentDidMount() {
+        document.body.appendChild(this.node);
+    }
+
+    componentWillUnmount() {
+        document.body.removeChild(this.node);
+    }
+    render() {
+        const { visible,children } = this.props;
+        
+        return visible && ReactDOM.createPortal(
+            children,
+            this.node
+        )
+    }
+}
+
+export default NewPortal;

+ 7 - 3
src/components/Treat/index.jsx

@@ -17,6 +17,7 @@ import adverseReactionIcon from './img/adverseReaction.png';
 import $ from "jquery";
 import {dragBox} from '@utils/drag';
 import ReactDom from "react-dom";
+import NewPortal from './NewPortal'
 
 class Treat extends Component {
     constructor(props){
@@ -71,7 +72,8 @@ class Treat extends Component {
                 title, drugInfoList, hideDrugInfoMore, adversReactionList, changeReact, followUp, setFollowUp, isRead, hasFollowUp} = this.props;
         const { zIndex,show } = this.state
         const domNode = document.getElementById('root');
-        return ReactDom.createPortal(
+        // return ReactDom.createPortal(
+            return <NewPortal visible = 'true'>
             <div   className={style['treat-wrapper']}>
                 <div className={style['treat-mask']} onClick={this.hideTreat}>
                 </div>
@@ -131,8 +133,10 @@ class Treat extends Component {
                 {showDrug && drugInfo && <DrugInfo setTreatBox={this.setTreatBox} treatIndexSet={treatIndexSet} drugInfo = {drugInfo} hideDrugInfo = {hideDrugInfo}></DrugInfo>}
                 {/* 查询多个药品说明书 (添加数据查看药品说明书用)*/}
                 {/* {showDrug && <DrugInfo drugInfoList = {drugInfoList} hideDrugInfoMore = {hideDrugInfoMore}></DrugInfo>} */}
-            </div>,domNode
-        )
+            </div>
+            </NewPortal>
+        //     ,domNode
+        // )
     }
 }