乾坤数据传递

package.json

@@ -44,6 +44,7 @@
     "react-virtualized": "^9.22.3",
     "redux": "^4.0.1",
     "redux-saga": "^1.0.5",
+    "rxjs": "^7.5.5",
     "showdown": "^1.9.1",
     "smooth-scroll": "^16.1.3",
     "typescript": "4.4.4",

src/App.js

@@ -4,7 +4,7 @@ import {
   Route, Switch
 } from 'react-router-dom';
 
-import { ContextPath } from './util';
+import { $hostParams, ContextPath } from './util';
 import loadable from "./util/loadable";
 
 import { AssetMountReference } from './util/constant';
@@ -29,16 +29,33 @@ const EditTemplate = loadable(()=> import('./view/Manage/ModelConfig/Component/E
 const AssetTree = loadable(()=> import('./view/Manage/AssetManage/Component/AssetManageTree'));
 
 export class App extends React.Component {
+  constructor() {
+    super();
+    this.$$hostParams = null;
+    this.state = {
+      hostParams: this.params
+    };
+  }
 
-  render() {
+  componentDidMount() {
+    this.$$hostParams = $hostParams.subscribe(() => { 
+      this.setState({ hostParams: $hostParams.getValue() });
+    })
+  }
 
-    const { params, callback, setGlobalState, onGlobalStateChange } = this.props;
+  componentWillUnmount() {
+    this.$$hostParams?.unsubscribe()
+  }
+
+  render() {
+    const { setGlobalState, onGlobalStateChange } = this.props;
+    const { hostParams } = this.state;
 
     let message = '', id = '', terms = [];
-    if (params) {
-      message = params.message||'';
-      id = params.id||'';
-      terms = params.terms||[];
+    if (hostParams) {
+      message = hostParams.message||'';
+      id = hostParams.id||'';
+      terms = hostParams.terms||[];
     }
 
     if (message === 'showDataModelDetail') {
@@ -76,7 +93,7 @@ export class App extends React.Component {
           reference={AssetMountReference}
           checkable={true}
           onCheck={(values) => { 
-            callback&&callback(values); 
+            hostParams.callback&&hostParams.callback(values); 
           }}
           {...this.props} 
         /> 
@@ -86,8 +103,8 @@ export class App extends React.Component {
     if (message === 'showDatasource') {
       return (
         <AppContext.Provider value={{
-          env: params?.env,
-          user: params?.user,
+          env: hostParams?.env,
+          user: hostParams?.user,
           setGlobalState,
           onGlobalStateChange
         }}>
@@ -98,8 +115,8 @@ export class App extends React.Component {
 
     return (
       <AppContext.Provider value={{
-        env: params?.env,
-        user: params?.user,
+        env:  hostParams?.env,
+        user:  hostParams?.user,
         setGlobalState,
         onGlobalStateChange
       }}>

src/index.js

@@ -10,6 +10,7 @@ import { store } from './model';
 import { App } from './App'
 
 import './index.less';
+import { $hostParams } from "./util";
 
 function render(props) {
   const { container, ...restProps } = props;
@@ -51,4 +52,8 @@ export async function mount(props) {
 export async function unmount(props) {
   const { container } = props;
   ReactDOM.unmountComponentAtNode(container ? container.querySelector('#root') : document.querySelector('#root'));
+}
+
+export async function update(props) {
+  $hostParams.next(props);
 }
\ No newline at end of file

src/util/index.js

@@ -2,6 +2,7 @@ import React from "react";
 import { message, notification, Modal, Space, Button } from 'antd';
 import { Redirect } from 'react-router-dom';
 import { ExclamationCircleOutlined } from '@ant-design/icons';
+import { BehaviorSubject } from 'rxjs';
 
 import { dispatchLatest, action } from '../model';
 import { set_sess_state } from "../model/reducer";
@@ -16,6 +17,8 @@ export const inputWidth = isSzseEnv?360:240;
 
 export const ContextPath = '/data-govern';
 
+export const $hostParams = new BehaviorSubject({});
+
 const routeMap = {};
 export const ConvertToRouteMap = function (routes, pPath, pRoute) {