html

html 渲染原生 HTML，内容可由字符串、CDATA 或文件提供。

XML 元素

html

Java 类

Html

基本用法

该元素用于在 XML 中嵌入 HTML。支持单独的 HTML 元素或 HTML 代码块。HTML 代码中，只能包含一个根元素，例如，<header>、<footer>、<main> 或 <div>。根元素内可以有任意个 <div> 元素用于显示内容。

开发者需要确保 HTML 内容的清洁，在通过组件展示给用户之前，需要删除其中的危险代码。原始内容直接展示给用户用可能会造成跨站脚本攻击。

从消息包定义内容

以下示例展示了如何通过 消息包 的字符串提供 HTML 内容：

<html content="msg://html.content"/>
messages.properties
com.company.onboarding.view.component.html/html.content=\
<main>\
  <h1>Main Content</h1>\
  <p>This is the main content area.</p>\
    <div>\
      <h2>Section 1</h2>\
      <p>This is the first section of the main content.</p> \
    </div>\
    <div>\
      <h2>Section 2</h2>\
      <p>This is the second section of the main content.</p>\
    </div>\
</main>

内联字符数据

通过 CDATA（字符数据）也可以提供相同的 HTML 内容：

<html id="html">
    <content>
        <![CDATA[
        <main>
            <h1>Main Content</h1>
            <p>This is the main content area.</p>
            <div>
                <h2>Section 1</h2>
                <p>This is the first section of the main content.</p>
            </div>
            <div>
                <h2>Section 2</h2>
            <p>This is the second section of the main content.</p>
            </div>
        </main>
    ]]>
    </content>
</html>

文件

在线示例

HTML 代码也可以用下列方法之一通过文件提供。

静态资源内容

文件可以由应用程序静态托管。假设文件位于： /src/main/resources/META-INF/resources/html/html-file.html，则可以这样使用：

<layout classNames="html-component">
    <tabSheet id="tabSheet" width="100%">
        <tab id="declarativeTab" label="Declaratively added component">
            <html file="META-INF/resources/html/html-component.html"/>
        </tab>
    </tabSheet>
</layout>
默认情况下，静态内容托管在 classpath 的 /static、/public、/resources 或 /META-INF/resources 目录。详情参考： Spring Boot 文档。

流资源内容

HTML 代码还可以通过文件的 InputStream 提供，然后组件可以使用这个流进行初始化。

该组件不能通过 UiComponents bean 创建，因为其不具有无参数构造器。 
private static final String SRC_PATH = "META-INF/resources/html/html-component.html";

@ViewComponent
private JmixTabSheet tabSheet;

@Autowired
private Resources resources;

@Subscribe
public void onInit(InitEvent event) {
    try (InputStream resourceAsStream = resources.getResourceAsStream(SRC_PATH)) {
        Html html = new Html(resourceAsStream);
        tabSheet.add("Programmatically added component", html);
    } catch (IOException e) {
        throw new UncheckedIOException(e);
    }
}

XML 属性

下面是 html 的特殊属性：

名称 描述 默认值

content

指定组件需要渲染的 HTML 内容，可以是消息包内的键值或者 XML 中的 CDATA 数据。

—

file

指定获取 HTML 内容的文件路径。

—

下面是 html 支持的其他通用属性：

id - alignSelf - classNames - colspan - css - visible

事件和处理器

下面是 html 支持的通用事件：

AttachEvent - DetachEvent