グローバルvueコンポーネントでメソッドを呼び出すにはどうすればよいですか？

Question

私はルートVUEコンポーネントapp.jsを持っている：

... 
const app = new Vue({ 
    el: '#app', 
    ... 
    methods: { 
     modalShow: function(target, id=null, message=null){ 
      ... 
     }, 
     ... 
    } 
}); 

私はこのような子コンポーネントがあります。

<template> 
    <div> 
     <ul> 
      <li> 
       <a href="#" class="thumbnail" 
        title="Add photo" 
        @click="modalShow('modal-add-photo', product.id)" 
       > 
        <span class="fa fa-plus fa-2x"></span> 
       </a> 
      </li> 
     </ul> 
    </div> 
</template> 

<script> 

    export default { 
     ... 
     methods: { 
      ... 
     } 
    } 
</script> 

modalShow方法がルートであるが。どのように私は子供からそれを呼び出すことができますか？

上記のコードは、現在実行されている場合は、私は次のエラーを取得する：

[Vue warn]: Property or method "modalShow" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.

Answer 1

は、子コンポーネントまでmodalShow方法を渡します。

<child :modal-show="modalShow"></child> 

export default { 
    props:["modalShow"] 
} 

次に、このメソッドを子で使用できます。