mustacheは口ひげらしい
vue.jsを調べていたら前に聞いたことがあるので、見てみると。
マスタッシュ構文(Mustache構文)とは、Vue.jsにおける基本的なテキスト展開の方法のこと。
HTML内で{{ プロパティ名 }}で記述する。
だそうです。<html> <body> <div id="application"><!-- Vueインスタンスのelプロパティと紐付け--> {{ message }} </div> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> </body> </html>出典 https://dice-record.com/vuejs-mustache-hello-world/#Mustache
mustacheの詳しい説明
https://mustache.github.io/mustache.5.htmlにくわしく書いてあるらしい。
一部抜粋してgoogle先生に日本語に翻訳してもらうと。
記述
Moustacheは、HTML、構成ファイル、ソースコードなど、あらゆるものに使用できます。ハッシュまたはオブジェクトで提供される値を使用して、テンプレート内のタグを展開することにより機能します。
if文、else節、またはforループがないため、これを「ロジックレス」と呼びます。代わりにタグのみがあります。一部のタグは値で置き換えられ、他のタグは値なしで置き換えられ、他のタグは一連の値で置き換えられます。このドキュメントでは、さまざまな種類のMustacheタグについて説明します。
タグの種類
タグは二重の口ひげで示されます。{{person}}はそのままのタグです{{#person}}。両方の例でperson、キーまたはタグキーと呼びます。さまざまなタイプのタグについて話しましょう。
変数
最も基本的なタグタイプは変数です。{{name}}基本テンプレート内のタグが見つけようとしますname現在のコンテキスト内のキーを。nameキーがない場合、親コンテキストは再帰的にチェックされます。トップコンテキストに到達してもnameキーが見つからない場合、何もレンダリングされません。
すべての変数はデフォルトでHTMLエスケープされています。エスケープされていないHTMLを返したい場合は、トリプルヒゲを使用します{{{name}}}。
&変数をエスケープ解除するためにも使用できます{{& name}}。これは、区切り文字を変更するときに役立ちます(以下の「区切り文字の設定」を参照)。
デフォルトでは、変数「miss」は空の文字列を返します。これは通常、Mustacheライブラリで構成できます。たとえば、RubyバージョンのMustacheは、このような状況での例外の発生をサポートしています。
Template:
* {{name}}
* {{age}}
* {{company}}
* {{{company}}}
Hash:
{
“name”: “Chris”,
“company”: “GitHub”
}
Output:
* Chris
*
* <b>GitHub</b>
* GitHub
ですって。
何のことだろう。