jsf - 有没有办法让 Primefaces 中的图形图像仅按需执行 "value"方法？

Question

我想显示一个带有多个缩略图的自定义图库。单击其中一个时，会显示一个覆盖面板，其中包含具有更高质量图像的图形图像。由于高质量图像每张约 5MB，我只想按需加载它们。

我已经尝试过使用“rendered”属性，但这似乎也没有用。我还尝试了带有 javascript 函数的“onclick”，但也没有产生预期的结果。

<p:graphicImage value="#{dataHolderBean.imageHolderBean.loadFullSizeImage()}"
class="centeredImageOverlay" cache="false">
<f:param name="currentImageId" value="#{images.imageId}" />
</p:graphicImage>

我想在点击另一张图片时调用 value="#{dataHolderBean.imageHolderBean.loadFullSizeImage()}"这个方法。

Answer 1

您为什么不寻找一种可以延迟加载覆盖面板内容的解决方案？对我来说，这听起来像是一个更通用的解决方案(然后它里面的任何东西都会被延迟加载)你站着并且更有可能已经实现了一些东西。

来自 p:overlayPanel 的 PrimeFaces 展示(强调我的)

Overlay Panel

OverlayPanel is a generic container component that can overlay other components on page. Notable features are custom positioning, configurable events and effects. Lazy content loading to reduce page load time is also supported via dynamic option, when enabled overlayPanel will load the contents just before being shown.

来自 PrimeFaces 文档

Dynamic Mode

Dynamic mode enables lazy loading of the content, in this mode content of the panel is not rendered on page load and loaded just before panel is shown. Also content is cached so consecutive displays do not load the content again. This feature is useful to reduce the page size and reduce page load time.

因此延迟加载是通过 dynamic 属性完成的，该属性甚至在 showcase 中都有一个示例

<p:commandButton id="movieBtn" value="Dynamic" type="button" />
<p:overlayPanel id="moviePanel" for="movieBtn" hideEffect="fade" dynamic="true" style="width:600px" modal="true">
    ...
</p:overlayPanel>