親要素の値にVUE子が合格します

図1に示すように、サブアセンブリは、値がトリガイベントを通過する必要が親コンポーネントを渡す,. $エミットこの2つのパラメータを有する値によって行わ、第1の方法は、親コンポーネントでこのメソッドの名前を受け入れることで、他の親コンポーネントに価値があります

。1 <テンプレート>
 2      の<div>
 3。         I成分の息子、私は父を与える：リスト} {{}
 。4          <P> <ボタン@ =をクリックして" toFather " > </ボタン> </ P>父にクリックしてください
 5。      < / div>
 6 </テンプレート>
 7  
。8 <SCRIPT>
 9エクスポートデフォルト{
 10      データ（）{
 11          リターン{
 12は、              リスト：" お金が" 
13である         }
 14      }
 15の     方法：
{ 16          toFather（）{
 17              //giveValue：送信データがthis.list、親に指定されたコンポーネントを結合する機能である：アセンブリ、サブアセンブリ、データ転送の親
18は、             この $ EMIT（「giveValue 」、この.LIST）
 。19          }
 20      }
 21れる }
 22は、 
23です </スクリプト>

 

図2は、親コンポーネントのメソッドは、それらの特性有料で、サブアセンブリ送信コールバックメソッドを受信するために、パラメータデータを必要

サブアセンブリのタグ形式のサブアセンブリ法=「親コンポーネントメソッド」@

1 <テンプレート>
 2      の<div>
 3         <H1>私は親コンポーネント、数字を取るために彼の息子を聞いています：<スパンのスタイル= " 色：オレンジ" > {{NUM}} </ span>を</ H1>
 4         <息子giveValue = @ " のgetValue " > </ソン>
 5      </ div>
 6 </テンプレート>
 7。 
8。 <SCRIPT>
 9。インポート息子から ' ./son ' 
10エクスポートデフォルト{
 11。     データ（）{
 12は         リターン{
 13は              NUM："' 
14          }
15      }、
 16      成分：{
 17          息子
 18      }、
 19個     の方法：{
 20          のgetValue（newValueに）{
 21              この .nu​​m = newValueに
 22          }
 23      }
 24  }
 25 </ SCRIPT>