値の転送を実現するために、2つの同じレベルのコンポーネントをVueで作成します。

<div id='アプリ'>
 <子供1></子供1>
 <子供2></子供2>
</div>
<スクリプト>
  var children1 = {};
  var children2 = {};
 var vm = 新しい Vue({
  el:'#app',
  コンポーネント:{
   子供1,
   子供2
  }
 })
</スクリプト>

 <div id='アプリ'>
  <子供1></子供1>
  <子供2></子供2>
 </div>
 <スクリプト>
     var Event = new Vue({}); // 値の転送の媒体として使用される vue インスタンスを作成します var children1 = {
   テンプレート:`
    <div>
     <button @click='send'>クリックすると、children2 コンポーネントにデータが送信されます</button>
    </div>
   `、
   データ（）{
    戻る {
     メッセージ:「子供にデータを送信したい2」
    }
   },
   方法:{
    送信（）{ 
     イベント.$emit('go',this.msg) 
    }
   }
  };
   var children2 = {
   テンプレート:`
    <div>
     <h2>children1 コンポーネントから受信した値: {{msg1}}</h2>  
    </div>
   `、
   データ（）{
    戻る {
     メッセージ1:''
    }
   },
   作成された(){
    Event.$on('go',(v) => { // これは矢印関数を使用する必要があるため
     this.msg1 = v;
    })
   }
  };
  var vm = 新しい Vue({
   el:'#app',
   コンポーネント:{
    子供1,
    子供2
   }
  })
</スクリプト>