# 引入
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('...') 两种形式 |