# 引入

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

// or

import { showFunctionalComponent, showFunctionalComponentQueue} from 't-comm/lib/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('...') 两种形式

Last Updated: 2024/10/11 07:54:02