Home > SYS_IFrame > openIFrame

SYS_IFrame.openIFrame() method

This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.

Open iframe window

Signature

function openIFrame(
	htmlFileName: string,
	width?: number,
	height?: number,
	id?: string,
	props?: {
		maximizeButton?: undefined | false | true;
		minimizeButton?: undefined | false | true;
		minimizeStyle?: undefined | 'collapsed' | 'constricted';
		buttonCallbackFn?:
			undefined | ((button: 'close' | 'minimize' | 'maximize') => void | Promise<void>);
		onBeforeCloseCallFn?:
			undefined | (() => boolean | undefined | Promise<boolean | undefined>);
		grayscaleMask?: undefined | false | true;
		title?: undefined | string;
		x?: undefined | number;
		y?: undefined | number;
	},
): Promise<boolean>;

Parameters

Parameter	Type	Description
htmlFileName	string	The path of the HTML file to load within the extension package, starting from the extension root directory, e.g. /iframe/index.html
width	number	(Optional) Width of the iframe window
height	number	(Optional) Height of the iframe window
id	string	(Optional) Iframe window ID, used to close the iframe window
props	{ maximizeButton?: undefined | false | true; minimizeButton?: undefined | false | true; minimizeStyle?: undefined | 'collapsed' | 'constricted'; buttonCallbackFn?: undefined | ((button: 'close' | 'minimize' | 'maximize') => void | Promise<void>); onBeforeCloseCallFn?: undefined | (() => boolean | undefined | Promise<boolean | undefined>); grayscaleMask?: undefined | false | true; title?: undefined | string; x?: undefined | number; y?: undefined | number }	(Optional) Other parameters

Returns

Promise<boolean>

Whether the operation is successful

Remarks

This API can only be called by extension packages. Users need to include an HTML file for embedding in the extension package;

After this API is called, a Dialog window will open. The title of the Dialog window is the <title> of the HTML file, and the title bar has a close button;

The body is an iframe. width and height are the width and height of the iframe in the body;

The iframe needs to display the content of htmlFileName. This HTML is obtained from the extension package and has been stored in IndexedDB during installation

Note: This API is only valid for extensions. Calling it in a standalone script environment will always throw Error

Example

// 1. 打开一个带标题和最大化/最小化按钮的内联框架窗口（自建 ID 便于后续定位）
const opened = await eda.sys_IFrame.openIFrame('/extension.json', 360, 240, '嘉立创示例_窗口', {
	title: '嘉立创示例 内联框架窗口',
	minimizeButton: true,
	maximizeButton: true,
	grayscaleMask: false,
});
console.log('打开结果：', opened);

// 2. 关闭刚才打开的窗口还原界面（自建自删，保证案例可重复运行）
const closed = await eda.sys_IFrame.closeIFrame('嘉立创示例_窗口');
console.log('关闭结果：', closed);