@td-design/react-native/lib/module/portal/PortalHost.js

react-native UI组件库

import React from 'react';
import { View } from 'react-native';
import { PortalContext } from './PortalContext';
import { ADD_TYPE, REMOVE_TYPE, TopViewEventEmitter } from './PortalGuard';
import PortalManager from './PortalManager';
export default class PortalHost extends React.Component {
  static displayName = 'Portal.Host';
  nextKey = 0;
  queue = [];
  componentDidMount() {
    const manager = this.manager;
    const queue = this.queue;
    this.addListener = TopViewEventEmitter.addListener(ADD_TYPE, this.mount);
    this.removeListener = TopViewEventEmitter.addListener(REMOVE_TYPE, this.unmount);
    while (queue.length && manager) {
      const action = queue.pop();
      if (!action) {
        continue;
      }
      switch (action.type) {
        case 'mount':
          manager.mount(action.key, action.children);
          break;
        case 'update':
          manager.update(action.key, action.children);
          break;
        case 'unmount':
          manager.unmount(action.key);
          break;
        default:
          break;
      }
    }
  }
  componentWillUnmount() {
    var _this$addListener, _this$removeListener;
    (_this$addListener = this.addListener) === null || _this$addListener === void 0 ? void 0 : _this$addListener.remove();
    (_this$removeListener = this.removeListener) === null || _this$removeListener === void 0 ? void 0 : _this$removeListener.remove();
  }
  setManager = manager => {
    this.manager = manager;
  };
  mount = (children, _key) => {
    const key = _key || this.nextKey++;
    if (this.manager) {
      this.manager.mount(key, children);
    } else {
      this.queue.push({
        type: 'mount',
        key,
        children
      });
    }
    return key;
  };
  update = (key, children) => {
    if (this.manager) {
      this.manager.update(key, children);
    } else {
      const op = {
        type: 'mount',
        key,
        children
      };
      const index = this.queue.findIndex(o => o.type === 'mount' || o.type === 'update' && o.key === key);
      if (index > -1) {
        this.queue[index] = op;
      } else {
        this.queue.push(op);
      }
    }
  };
  unmount = key => {
    if (this.manager) {
      this.manager.unmount(key);
    } else {
      this.queue.push({
        type: 'unmount',
        key
      });
    }
  };
  render() {
    const manager = {
      mount: this.mount,
      update: this.update,
      unmount: this.unmount
    };
    return /*#__PURE__*/React.createElement(PortalContext.Provider, {
      value: manager
    }, /*#__PURE__*/React.createElement(View, {
      style: {
        flex: 1
      },
      collapsable: false
    }, this.props.children), /*#__PURE__*/React.createElement(PortalManager, {
      ref: this.setManager
    }));
  }
}
//# sourceMappingURL=PortalHost.js.map