式と変数展開
本文中の変数展開は Mustache 風の {{ }} を使います。文は書けず、式のみです。
# Hello {{ name }}
- {{ object.animal }} is {{ object.state }}
- {{ color | "transparent" }}
書ける式
| 種類 | 例 |
|---|---|
| 変数参照 | {{ title }} |
| メンバアクセス | {{ user.name }} |
| 添え字 | {{ items[0] }} |
| 三項演算子 | {{ isNight ? "Dark" : "Light" }} |
| デフォルト値(パイプ) | `` {{ title |
| component 呼び出し | {{ cardItem({ title: "Hi" }) }} |
| メソッド | {{ count.toLocaleString('ja-JP') }} |
デフォルト値(パイプ)
{{ title | "hardcoded title" }}
左辺が falsy(undefined、null、""、0、false など)のとき、右辺を使います。|| 演算子と同じ挙動です。
{{{ }}}
三重括弧も使えます。現状の挙動は {{ }} と同じです(値をそのまま埋め込み)。将来エスケープを導入する際の予約として位置づけています。
エスケープ
{{ }} も {{{ }}} も HTML / Markdown エスケープは行いません。後段の MD→HTML 変換や、呼び出し側でのサニタイズが必要です。
危険そうな値が context に含まれる場合は suspicious_context_value 警告が出ますが、値自体は改変しません。
親スコープの可視性
| 構文 | 親の変数 |
|---|---|
| include | 見える |
| component | 見える |
| each 内 | ループ変数・親変数とも見える |
書けないもの
- 文(
const、ifなど)— hyogen ブロック内で書く each— 構造ディレクティブとして hyogen ブロックで書く- 未登録の関数呼び出し(
foo()など) .toLocaleString以外のメソッド(.map、.trimなど)
例
<!--
@hg
const isNight = false
@endhg
-->
# Light Status
- {{ isNight ? "Dark" : "Shine" }}
出力:
# Light Status
- Shine