子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件。附加参数都会传给监听器回调。
子组件
<template>
<div>
<div class="warp-mark" v-if="bingGoShow">
<img src="../../assets/resources/common/bingo.jpg" alt="">
<div class="again" @click="again">
<img src="../../assets/resources/common/again.png" alt="">
</div>
<div class="nextStep">
<img src="../../assets/resources/common/nextStep.png" alt="">
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return{
bingGoShow:true
}
},
methods:{
again(){
this.$emit("onceAgain")
},
}
}
</script>
父组件
<template>
<div>
<mark @onceAgain="again"></mark>
</div>
</template>
<script>
import mark from '@/components/mark /mark .vue';
export default {
methods:{
again(){
alert("测试")
}
}
}
</script>