Webアプリケーションを公開するまでのつぶやき 2
プロローグは↑こちら。
引き続きドキュメントを読んでいます。
今回は気になったところをちょこちょこ引用していこうかと思います。
ドキュメントを読む
同じページにアプリケーションのインスタンスが 1 つに制限されるわけではありません。
Vue アプリケーションの作成
ほう、なるほど。
もし Vue をサーバーレンダリングされた HTML を拡張するために使用していたり、大きなページの中で特定の一部を操作するためだけに必要とするなら、ページ全体で単一の Vue アプリケーションのインスタンスでマウントするのを避けましょう
なるほど、よく分からないけど覚えていおきたい感じですね。
今回は多分この用途にはあてはまらないので単一のインスタンスで良いのかな？
なんか不都合になりそうだったら複数にすればいっかくらいの感じでいます。
<span>Message: {{ msg }}</span>マスタッシュのタグの中身は、対応するコンポーネントのインスタンスが持つ msg というプロパティの値に置き換えられます。msg プロパティが変更されるたびに、マスタッシュの中身も更新されます。
テンプレート構文
ふむふむ、{{}}(マスタッシュ構文)のとこだけ再描画してくれるってことかな。
なんて便利な。
マスタッシュは基本的にはテキストしか表現できないが、HTMLが書きたければv-htmlを使えってことみたいですね。
このv-xxxみたいなのをディレクティブといって構文はここにまとまってそうですね。
覚えとこう。
マスタッシュ構文のなかでは式が使える。
<!-- これは文であり、式ではありません: -->
{{ var a = 1 }}
<!-- フロー制御も動作しません。代わりに三項演算子を使用してください。 -->
{{ if (ok) { return message } }}
これは文であり、式ではありません。
は笑った。
ディレクティブやマスタッシュの中では関数が呼べる。
バインディングの式の内部で呼び出される関数は、コンポーネントが更新されるたびに呼び出されます。そのため、データの変更や非同期処理をトリガーするような副作用を持たせてはいけません。
テンプレート構文
ってことなので気をつけよう。
ディレクティブのv-bindにnullを入れるとバインディング削除になるらしい。
<!-- この場合、コンパイラーで警告が発生します。 -->
<a :['foo' + bar]="value"> ... </a>
こんな感じでスペースや引用符は無効になるそうで、警告でるとのこと。
修飾子は、ドット (.) で示される特別な接頭辞で、ディレクティブを何らかの特別な方法でバインドすることを表します。
テンプレート構文
とのこと。
詳しくは後々あるみたいなのでさらりと流す。
うをを。
次の章は動画へのリンクが１つ貼ってあるだけだった。
一応みた。
けど、英語がいまいちわからないので、コードみてなんとなくわかった気になった。
これ以降全部動画っぽいので、さらりと流し見します。
この記事が気に入ったらサポートをしてみませんか？