/** * Portal Context - 基于 Context + Ref 的命令式弹框管理 * 解决了 eventemitter3 方案的以下问题: * 1. 上下文丢失(ConfigProvider、Redux、自定义 Context 等) * 2. 额外依赖 * 3. 非 React 惯用模式 */ import React from 'react'; /** Portal 管理器类型 */ export type PortalManager = { /** 添加弹框 */ add: (component: React.ComponentType, id: string, props: any) => void; /** 更新弹框 */ update: (id: string, props: any) => void; /** 移除弹框 */ remove: (id: string) => void; /** 关闭并移除全部弹框 */ closeAll: () => void; }; /** * 获取 Portal 管理器 * 可在 React 组件外部使用 */ export declare const getPortalManager: () => PortalManager; /** * 在 React 组件内部使用 Portal 管理器 */ export declare const usePortalManager: () => PortalManager; /** PortalProvider Props */ export type PortalProviderProps = { children?: React.ReactNode; /** 弹框挂载的 DOM 容器节点,默认为 document.body */ container?: Element | null; }; /** * PortalProvider 组件 * 提供弹框管理能力,需要在应用中引入(建议放在能访问所有 Context 的位置) * * 注意:应用根节点只应挂载一层 PortalProvider 或兼容层 , * 不要同时挂载两者,否则后挂载者会覆盖全局管理器。 * * @example * ```tsx * // Umi 项目 - 放在 container 内部以访问 useModel * const PageWraper = ({ children, routes }: any) => { * return ( * * {children} * * * ); * }; * * export function rootContainer(container: React.ReactElement) { * return React.createElement(PageWraper, null, container); * } * ``` */ export declare const PortalProvider: React.FC; export default PortalProvider;