VueJS1ダイナミック$親。$のparent.function長

Question

私はこの1が動作しているいくつかのネストされた子コンポーネント

{{ $parent.$parent.testFunction('foo', 'bar') }} 

で親機能を使用しようとしたが、午前私は巣のレベルを変更していますたびに、電話を変更する必要があります：

{{ $parent.testFunction('foo', 'bar') }} 

これを修正する方法はありますか？ 親は$ルートレベルの要素ではないため、機能しません。 :)

Answer 1

イベントを使用して親ツリーをディスパッチし、それが到着したときに処理できるようにするのが最善の方法です。

あなたの子供と親がシステム内にどこに存在するかは関係ありません。

events: { 
    "testFunction": function(foo, bar) { 
     // Do Foobar 
     return true; // Stops the event from going further 
        // return nothing to have it continue up the chain 
    } 
} 

は、あなたのコンポーネントにちょうど私が個人的にそれを使用する必要があるすべてのコンポーネントにtestFunctionをインポートすることになる

this.$dispatch("testFunction", "Foo", "bar"); 

Answer 2

を実行します。

var doFoo = function() { 
    console.log('foo') 
} 

// Component A 
{ 
    methods: { 
    doFoo: doFoo, 
    } 
} 

// Component B 
{ 
    methods: { 
    doFoo: doFoo, 
    } 
} 

実際にはここでフィルタを使用したいと思いますが、