ドライグッズの学習 ヴューアドバンスシリーズ ヴューダイナミックコンポーネントの使用

シナリオ：同じ場所で、異なる状態は、v-if、v-else-ifの多くを使用して、異なるコンポーネントを呼び出す必要がある場合、フィールド上の動的コンポーネントの必要性！

• 1つ目は、ダイナミック・コンポーネント・タグのコンポジションの波を導入することです。

<component v-bind:is="currentTabComponent"></component>
  
<component :is="currentTabComponent"></component> //注：構文糖

ここで、componentは動的コンポーネントのタグ名で、currentTabComponentは必須コンポーネント名です。

次にコンポーネントのセクションを見てください：

//コンポーネントを登録したり、コンポーネントを作成したりする最初の段階で
var home = {template:'<div> </div>'};
var user = {template:'<div> </div>'};
//コンポーネントの登録
components: {
 home,
 user,
 },
//コンポーネント名を配列として列挙する
data(){
 arr:['home','user'],
 index:0
},
//計算プロパティを定義する
computed:{
 currentView(){
 return this.arr[this.index];
 }
},
//
method(){
 //ここでは、インデックスの値を変更するメソッドを追加する。
}