VUE-组件间通信（二）$emit

$emit

1、单向绑定

子组件向父组件传值

2、使用示例

父组件

<template><div id="app"><!-- 监听自定义触发事件 @emitInvokeEvents--><SonDemo @emitInvokeEvents="fatherFunction"></SonDemo></div>
</template><script>
import SonDemo from './components/SonDemo.vue'export default {name: 'App',components: {SonDemo},methods:{fatherFunction(value){console.log("父组件的方法被唤醒"+value)}}
}
</script>

子组件

<template>
<div><button @click="sonFunction">子组件向父组件传值</button>
</div>
</template>
<script>
export default {methods:{sonFunction(){   //emitInvokeEvents 自定义触发事件//@emitInvokeEvents  监听自定义触发事件//第一个参数：自定义事件//第二个参数：传递的值this.$emit('emitInvokeEvents','子组件向父组件传递的值');}}
}
</script>

效果