引入

import { showFunctionalComponent, showFunctionalComponentQueue } from 't-comm';

// 不支持 tree-shaking 的项目
import { showFunctionalComponent, showFunctionalComponentQueue} from 't-comm/lib/functional-component/index';

// 只支持 ESM 的项目
import { showFunctionalComponent, showFunctionalComponentQueue} from 't-comm/es/functional-component/index';

showFunctionalComponent(vueInstance, dialogComponent, dialogOptions)

描述：

函数式调用组件

参数：

参数名	类型	描述
vueInstance	Object	页面Vue实例（一般为页面this）
dialogComponent	Object	弹窗组件，支持静态导入import Dialog from '..'和动态导入const Dialog = () => import('...')两种形式
dialogOptions	Object	弹窗参数Object

返回:

Promise 回调组件实例

示例

function showDateTimePicker(this: any, {
  onConfirm,
  currentDate,
}) {
  showFunctionalComponent(
    this, () => import('src/local-component/ui/gp-match-horz/date-picker'),
    {
      currentDate,
      minDate: new Date(new Date().getTime() + 30 * 60 * 1000),
      onClickConfirm: (date) => {
        const dateNumber =  Math.floor(date.getTime());
        onConfirm(date, dateNumber);
      },
    },
  );
}

showFunctionalComponentQueue(context, dialogList, dialogComponent)

描述：

根据弹窗队列（dialogList）依次弹出

参数：

参数名	类型	描述
context	object	Vue 页面 Vue实例上下文（一般为页面this、window.app、new Vue() 等）
dialogList	array	弹窗列表
dialogComponent	Object	弹窗组件，支持静态导入 import Dialog from '..' 和动态导入 const Dialog = () => import('...') 两种形式