3

次の問題を考えてみましょう。

バスケットを含むページがあります。バスケットは、果物や車などのアイテムのリストを含むコンポーネントです。

このページには、カーバスケット、フルーツバスケット、オールバスケットの3つのバスケットがあります。カーバスケットには車が含まれ、フルーツバスケットにはフルーツが含まれ、オールバスケットには車とフルーツの両方が含まれます。

当初、アイテムは車とフルーツバスケットにのみあります。それらのバスケットのアイテムをクリックすると、アイテムはすべてのバスケットに移動します。オールバスケットのアイテムをクリックすると、アイテムは元のバスケットに戻ります。

また、果物アイテムと車アイテムのレンダリングは異なります。たとえば、car-itemには、fruit-itemとは異なる種類の背景が含まれている場合があります。また、アイテムには異なる種類の情報が含まれている場合があります。たとえば、car-itemには車の最高速度が含まれ、fruit-itemには果物の色が含まれます。

このレンダリングは、オールバスケットでも保持する必要があります。

タペストリーでどのようにページを作成しますか?完全な実装は必要ありません。私は、その問題をどのように解決できるかという原則に単に興味があります。

また、実装を簡素化するために、どのくらいの時間がかかるかを見積もることができますか?

4

2 に答える 2

2

まず、車や果物のコンポーネントを作成します。次に、車とフルーツバスケットの表示がアイテムをループし、それぞれのフルーツ/車のコンポーネントが表示されます。

混合バスケットは少し注意が必要です。タペストリーは動的構造(「動的動作、静的構造」)があまり得意ではないためif、車または果物のコンポーネントをレンダリングするための構造が必要になります。

<t:loop t:source="items" t:value="currentItem">
    <t:if t:test="currentCar">
       <span t:type="Car" t:car="currentCar" />
    </t:if>
     <t:if t:test="currentFruit">
       <span t:type="Fruit" t:fruit="currentFruit" />
    </t:if>
</t:loop>

そのコンポーネントのgetCurrentCar()メソッドはcurrentItem、が車でない場合はnullgetCurrentFruit()を返し、アイテムが果物でない場合はnullを返す必要があります。

リスト間を移動するには、適切なイベントハンドラーでActionLinksを使用するだけです。AJAXをサポートするには、Tapestryの組み込みのゾーン機能を使用できます。一度に複数のゾーンを更新するには、イベントハンドラーからMultiZoneUpdateオブジェクトを返すことができます。(または、独自の最適化されたクライアント側コードを作成することもできます。)

この基本構造を非常に短い時間で設定できるはずです。合計でどれくらいの時間がかかるかは、物事をどれだけ精巧にしたいかによって異なります。

于 2010-09-05T17:58:01.670 に答える
1

これがヘニングのアプローチの続きです:

<!-- render car basket -->
<t:loop t:source="carBasket" t:value="currentItem">
    <t:if t:test="currentCar">
       <span t:type="Car" t:car="currentCar" />
       <!-- TODO : eventlink for add to all basket -->
    </t:if>
</t:loop>

<!-- render fruit basket -->
<t:loop t:source="fruitBasket" t:value="currentItem">
     <t:if t:test="currentFruit">
       <span t:type="Fruit" t:fruit="currentFruit" />
       <!-- TODO : eventlink for add to all basket -->
    </t:if>
</t:loop>

<!-- render all basket -->
<t:loop t:source="allBasket" t:value="currentItem">
    <t:if t:test="currentCar">
       <span t:type="Car" t:car="currentCar" />
       <!-- TODO : eventlink for back to car basket -->
    </t:if>
     <t:if t:test="currentFruit">
       <span t:type="Fruit" t:fruit="currentFruit" />
       <!-- TODO : eventlink for back to fruit basket -->
    </t:if>
</t:loop>

このページには次のようなものがあります

@Property
private Item currentItem;

public Set<Item> getAllBasket(){
    return allBasket;
} 

public Set<Car> getCarBasket(){
    return carBasket;
} 

public Set<Fruit> getFruitBasket(){
    return fruitBasket;
}

public Fruit getCurrentFruit(){
   return currentItem instanceof Fruit ? (Fruit)item : null;
}

public Car getCurrentCar(){
    return curretItem instanceof Car ? (Car)item : null;
}
于 2010-09-06T08:06:05.407 に答える