Primefaces 对话框在网页中显示 header 和内容作为文本

Primefaces dialog displays a header and content as text in the webpage

我是 Primefaces 的新手,目前使用 primefaces 6.0,我正在尝试 运行 来自 primefaces 官方网站的在线示例。

该示例演示了对话框的使用,我按照在示例中看到的方式进行了操作,但是我观察到该页面显示了对话框标记 header 属性的值,后跟对话框的内容作为文本

我希望有人告诉我我做错了什么,请参阅我的视图中的以下代码和结果页面的屏幕截图

 <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">




         <html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">

    <h:panelGrid columns="1" cellpadding="5">

    <p:commandButton value="Basic" type="button" onclick="PF('dlg1').show();" 
    />

     <p:commandButton value="Modal" type="button" onclick="PF('dlg2').show();" />

    <p:commandButton value="Effects" type="button" onclick="PF('dlg3').show();" /> 

     </h:panelGrid>


    <p:dialog header="Basic Dialog" widgetVar="dlg1" minHeight="40">
    <h:outputText value="Resistance to PrimeFaces is futile!" />
    </p:dialog>


     <p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" 
     height="100">
    <h:outputText value="This is a Modal Dialog." />
    </p:dialog> 


    <p:dialog header="Effects" widgetVar="dlg3" showEffect="explode" 
     hideEffect="bounce" height="100">
    <h:outputText value="This dialog has nice effects." />
    </p:dialog>
    </html>

您的页面中必须有 h:head 标记。

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>

http://primefaces.org/faq.html