Bladeにおけるテンプレートの継承について
Laravelでテンプレートエンジンとして利用できるBladeには継承という機能があります。
テンプレートの継承機能については、こちらのページで解説されています。
https://readouble.com/laravel/5.6/ja/blade.html
大雑把に言うと、継承元ファイルにHTMLの骨組みと可変部分を定義し、その可変部分に代入する内容を継承先ファイルに定義するという機能です。
Vue.jsのテンプレート構文について
今回、Vue.jsのテンプレート構文を使って、Webアプリの画面をコーディングすることになりました。
Vue.jsのテンプレート構文を勉強中ですが、Bladeにおける継承のような機能が見当たらず戸惑っています。
できれば、継承機能を再現したいのですが、どのような方法がありますでしょうか?
別のパッケージを導入すれば可能でしょうか?
追記1
ご回答ありがとうございます。componentでも同じようなことができるとのことですが、混乱してしまいました。
例えば、継承を使った以下のような構成があったとします。
- ファイルA: 継承元。HTMLの骨組みと可変部分を定義
- ファイルB: 継承先。ファイルAの可変部分に注入する内容を定義
これをcomponentで置き換えるとどうなるのでしょうか?
イメージとしては、ファイルAがcomponentになって、それをファイルBから呼び出すということでしょうか?
追記2
ご回答ありがとうございます。追記1に関しては、紹介していただいた記事を参考に解決いたしました。
ファイルA(component)に<slot></slot>というのを入れておけば、そこが可変部分になるのですね。
これがわかっておりませんでした。
componentの親子間での情報の受け渡しはpropsを使うしかないのかと勘違いしておりました。
propsはデータの受け渡しには便利ですが、レイアウトの受け渡しには不便だなぁと感じていたのですが、slotを使うべきだったのですね。
ありがとうございました。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。