title: Vue common component communicate with different parent
body: <p>I have a requestion, how about vue.js's common component's best practice when communicating with different parent component.</p>
  
  <p>for example, in my scenario, a basic modal component, trigger a 'close' method, but it has two different parent component</p>
  
  <p>I find two solutions:</p>
  
  <ol>
  <li><p>parent need pass an additional prop, and then baisc component just
  trigger event which event's name is the prop value, so the listener
  parent component attched on could be called </p></li>
  <li><p>in basic modal just use this.$parent to visit parent component methods, or this.$parent.trigger('xxx'), and then parent knows what to do</p></li>
  </ol>
  
  <p>But, both above I think not very good, the first may need pass an additional prop, this let others who write a third, a forth parent component use the basic component not very handy. And the second may be felt more hard coded.</p>
  
  <p>So, is there is better solution in this case?   </p>