2016-04-30 8 views
3

Vue.jsの子コンポーネントで親/ルートレベルメソッドを呼び出そうとしていますが、私はTypeError: this.addStatusClass is not a functionというメッセージが表示され続けます。ここでVue.jsの子コンポーネントから親メソッドにアクセスする方法を教えてください。

Vue.component('spmodal', { 
    props: ['addStatusClass'], 
    created: function() { 
     this.getEnvironments(); 
    }, 
    methods: { 
     getEnvironments: function() { 
      this.addStatusClass('test'); 
     } 
    } 
}); 

new Vue({ 
    el: '#app', 
    methods: { 
     addStatusClass(data) { 
      console.log(data); 
     } 
    } 
}); 

はフルJSBINの例である:http://jsbin.com/tomorozonu/edit?js,console,output

私はthis.$parent.addStatusClass('test');呼び出した場合、それは正常に動作しますが、Vue.jsのドキュメントに基づいて、これは悪い習慣であり、私が働いていない小道具を使用する必要があります。

答えて

6

小道具を指定することは何もせず、親から何かを実際に渡す必要があります。この場合、関数です。

<spmodal :add-status-class="addStatusClass"></spmodal>