[解決済み】親イベントで子コンポーネントの関数を呼び出す方法

質問

文脈

Vue 2.0では、ドキュメントと その他 は、親から子への通信がpropsを介して行われることを明確に示しています。

質問

親が子にイベントの発生を伝えるには、プロップスを使ってどのようにすればよいですか？

イベントという名のプロップを見ていればいいのでしょうか？それは正しいとは思えませんし、代替案もありません ( $emit / $on は子から親へ、ハブモデルは離れた要素に対応します）。

例

親コンテナがあり、その子コンテナに API で特定のアクションを実行してもよいことを伝える必要があります。 関数をトリガーできるようにしたいのですが。

どのように解決するのですか？

子コンポーネントに ref を使用し $refs を使用して、子コンポーネントのメソッドを直接呼び出すことができます。

htmlを使用します。

<div id="app">
  <child-component ref="childComponent"></child-component>
  <button @click="click">Click</button>  
</div>

javascriptを使用します。

var ChildComponent = {
  template: '<div>{{value}}</div>',
  data: function () {
    return {
      value: 0
    };
  },
  methods: {
    setValue: function(value) {
        this.value = value;
    }
  }
}

new Vue({
  el: '#app',
  components: {
    'child-component': ChildComponent
  },
  methods: {
    click: function() {
        this.$refs.childComponent.setValue(2.0);
    }
  }
})

詳しくは Vueのrefsに関するドキュメント .