vue.jsの親テンプレートの関数を呼び出す

Question

私は以下のような親コンポーネントテンプレートのボタンを持っています。

<template> 
     <div class="data_table"> 
      <button class="mini ui button" @click="show">     
     </div> 
    </template> 

このshow()は

<script> 
    export default { 
     data: 
      function() { 
       return { 
        value: this.active1 
       } 
      }, 
     props: { 
      active1: true 
     },   
     methods: { 
      show() { 
       this.active1 = true 
      } 
     }, 
    } 
</script> 

がどのように私はshow()機能することを呼び出すことができます下のように子コンポーネントに保たれていますか？

私はvue-cliを使用しています。

おかげ

Answer 1

子コンポーネント

<template> 
<div class="data_table"> 
    <button class="mini ui button" @click="show">     
</div> 
</template> 


data: => ({ 
value: this.active1 
}), 
props: { 
active1: { 
    type: Boolean 
} 
}, 
methods: { 
    show() { 
    this.$emit('someEventName') 
    } 
} 

親コンポーネント

<template> 
    <child-component 
     :active1="booleanValue" 
     @someEventName="show" 
    /> 
</template> 


data: => ({ 
booleanValue: false 
}), 
method: { 
show() { 
    this.booleanValue = true 
} 
}