オブジェクト索引
Selector オブジェクトはセレクタ型の要素を表すオブジェクトです。Selector オブジェクトは、展開中でセレクタ型の要素を参照することで得られます。展開中では Selector オブジェクトを通してユーザが選択した子要素を調べ、必要な展開を行います。
| メソッド名 | 説明 |
|---|---|
| isSelected(str) | 子要素 str が選択され、入力されているか判定する |
| selectedName() | ユーザが選択した子要素の名前を返す |
| selectedValue() | ユーザが選択した子要素を返す |
isSelected() メソッドは、引数に指定された子要素が選択され、入力されているかどうかを調べます。選択されている場合には true を返し、選択されていない場合には false を返します。
選択されているかどうかを調べたい子要素の名前を指定します。
sel という名前のセレクタ型の要素が定義されているとします。そのセレクタに定義されている子要素「文章」が選択され入力されているかどうかを調べてみます。
<body>
........
<wr-if condition="sel.isSelected(\"文章\")">
<wr-then>
子要素「文章」は選択されています。
</wr-then>
<wr-else>
子要素「文章」は選択されていません。
</wr-else>
........
</body>
selectedName() メソッドは、ユーザが選択した子要素の要素名を返します。
sel という名前のセレクタ型の要素が定義されているとします。ページ作成者が選択して入力した子要素の名前を表示してみます。
<body>
........
%sel.selectedName()%
........
</body>sel という名前のセレクタ型の要素が定義されているとします。このセレクタには text という名前の１行テキスト型の子要素と、 image という名前のイメージ型の子要素が定義されているとします。
ページ作成者が選択して入力した子要素の名前を調べ、子要素に応じた展開を生成してみます。
<body>
........
<wr-if condition="sel.selectedName() == \"text\"">
<p>%sel.selectedValue()%</p>
</wr-if>
<wr-if condition="sel.selectedName() == \"image\"">
<img src="%sel.selectedValue()%" />
</wr-if>
........
</body>
選択された子要素の名前は selectedName() メソッドで取得しますが、実際に入力されたコンテンツデータは selectedValue() メソッドで取り出します。
この展開では wr-if を使って場合分けをして展開を作成していますが、コンポーネントとメソッドを組み合わせて使用することでもっと簡潔に展開を記述できる場合があります。selectedValue() メソッドの説明も参照してください。
selectedValue() メソッドは、ユーザが選択した子要素を返します。
sel という名前のセレクタ型の要素が定義されているとします。sel の子要素はいずれもコンポーネントであり、また、各コンポーネントは generateText() というメソッドをもっていて、そのメソッドで展開を生成するものとします。
ページ作成者が選択して入力した子要素を展開してみます。
<body>
........
%sel.selectedValue().generateText()%
........
</body>sel から selectedValue() メソッドで選択された要素を取得しています。この selectedValue() の呼び出しの結果返された何らかのコンポーネントデータに対して、generateText() メソッドを呼び出して展開を生成しています。
この展開自体は、どの子要素が選択され入力されたかを直接は意識していませんが、各コンポーネントが同名の generateText() というメソッドを持っていることを使って、非常に簡単に展開が書けています。