vue $emit的使用方式
Posted lovetl
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue $emit的使用方式相关的知识，希望对你有一定的参考价值。
子组件：
<template>
<button @click="clickme">点击我</button>
</template>
<script>
export default {
data() {
return {
message: "我是要传递的数据"
}
},
methods: {
clickme(){
this.$emit(‘my-click‘, this.message)
}
}
}
</script>
父组件：
<template>
<div id="app">
<child-a @my-click="getMessage"></child-a>
<!--父组件中通过监测my-event事件执行一个方法，然后取到子组件中传递过来的值-->
</div>
</template>
<script>
import sonfrom ‘./components/son.vue‘
export default {
components: {
son
},
methods: {
getMessage(msg){
console.log(msg)
}
}
}
</script>
以上是关于vue $emit的使用方式的主要内容，如果未能解决你的问题，请参考以下文章
Vue——自定义组件 & 自定义事件$emit & 插槽slot