5

単純なh：outputTextコンポーネントについて考えてみます。

<h:outputText value="#{myBean.myValue}"/>

ページがレンダリングされた後にその値を遅延ロードし、これが行われている間、値の代わりにカスタムの「ajaxloading」アイコンを表示するにはどうすればよいですか？

私はプロジェクトでPrimeFaces3.5を使用しているので、PF固有の実装は歓迎されます。

4

3 に答える 3

6

remoteCommandページの読み込み後に呼び出して（autoRun属性をtrueに設定することで実行されます）、これを実行して、を更新することをお勧めしますoutputText。

private String myValue;

// getter and setter

public void initMyValue() {
  // init myValue
}

ページにはajaxStatus、読み込み中の画像を表示するためのコンポーネントと、が必要outputTextです。p:remoteCommandまた、コンポーネントが必要です。

<p:ajaxStatus style="width:16px;height:16px;" id="ajaxStatusPanel">  
  <f:facet name="start">  
    <h:graphicImage value="ajaxloading.gif" />  
  </f:facet>
  <f:facet name="complete">  
    <h:outputText value="" />
  </f:facet>  
</p:ajaxStatus>

<h:outputText id="myText" value="#{myBean.myValue}"/>

<p:remoteCommand autoRun="true" actionListener="#{myBean.initMyValue}" update="myText"/>

編集：outputTextいくつかの長時間実行計算が含まれているため、の遅延読み込み値が必要だと思いましたが、バッキングBeanのoutputText最初のaddbooleanプロパティのレンダリングを完全に延期し、このプロパティをメソッドtrueの最後に設定initMyValueする場合：

private boolean loaded;

// getter and setter

public void initMyValue() {
  // init myValue
  loaded = true;
}

ページ上で次のように再編成します。

<h:panelGroup id="myPanel" layout="block">
  <h:graphicImage value="ajaxloading.gif" rendered="#{!myBean.loaded}"/>
  <h:outputText value="#{myBean.myValue}" rendered="#{myBean.loaded}"/>
</h:panelGroup>

<p:remoteCommand autoRun="true" actionListener="#{myBean.initMyValue}" update="myPanel"/>
于 2013-03-13T16:07:35.017 に答える
1

これが私がそれを実装することになった方法です：

<h:panelGroup id="loginLocation">
<p:graphicImage library="assets" name="small-kit-loader.gif" width="16" height="16" rendered="#{empty mybean.lastLoginLocation}"></p:graphicImage> 
<h:outputText value="#{myBean.lastLoginLocation}" rendered="#{!empty myBean.lastLoginLocation}"/>
</h:panelGroup>
<p:remoteCommand global="false" actionListener="#{actionBean.getUserLoginLocation(myBean.selectedUser)}" name="refreshLoginLocation" id="rc1" autoRun="true" update="loginLocation" process="@this"></p:remoteCommand>

個人的には、この実装に完全に満足しているわけではありません。

  1. 遅延読み込み状態は、本来あるべきクライアント側ではなく、サーバー側に保存されます
  2. バッキングBean（getUserLoginLocation）に別のメソッドを実装して値を取得し、それを別のプロパティ（lastLoginLocation）に明示的に格納する必要があります。ブラウザでページをレンダリングした後にレイジーコールされる単一のゲッターがあれば、はるかにクリーンでした。
  3. 簡単に再利用することはできません-バッキングBeanの「ロード済み」フラグ（この場合は＃{empty myBean.lastLoginLocation}）に依存し、アクションリスナーが実際に値を設定する必要があります。このアプローチに基づく複合コンポーネントは、バッキングBeanの特定のコードにも依存します。

このコードを改善する方法に関する推奨事項は大歓迎です！:)

于 2013-03-14T19:16:13.207 に答える
1

BlockUIを使用して、コンポーネントのロード中にコンポーネントを条件付きでブロックできます。

  1. preRenderComponentでイベントを定義する<h:outputText/>

       <h:outputText id="myText">
      <f:event name="preRenderComponent" id="started"/>
   </h:outputText>

  2. <p:blockUI/>イベントのIDをトリガーとしてaを定義します

       <p:blockUI block="myText" trigger="started" />

blockuiをカスタマイズして、画像などを表示できます。

注意点：そのコンポーネントのゲッターで重い物を持ち上げているので、これが必要だと思います。そのページのライフサイクルでゲッターが数回呼び出されることを知っておいてください。したがって、操作に時間がかかるという事実を隠しても、事実は変わりません。より良い設計は、「ロード」スロバーの演劇ではなく、耐久性のあるスコープでそのコンポーネントの値をプリロードしてキャッシュすることです。

于 2013-03-13T20:42:43.897 に答える