emit-value
时间: 2024-09-10 07:16:47 浏览: 11
`emit-value` 是 Vue.js 中用于组件通信的一个重要机制。它通常用于子组件向父组件传递数据或者触发一个事件。当你在一个子组件中的某个事件(比如按钮点击或表单提交)触发时,你可以调用 `this.$emit('event-name', value)` 来发送一个自定义事件到父组件。
这里 `event-name` 是你为这个特定事件命名的字符串,`value` 是你要传递的数据。在父组件中,你可以在 `v-on` 指令中监听这个事件并处理接收到的数据:
```html
<!-- 子组件 -->
<template>
<button @click="emitValue">点击我</button>
</template>
<script>
export default {
methods: {
emitValue() {
this.$emit('parentEvent', 'Hello from child!');
}
}
}
</script>
```
```html
<!-- 父组件 -->
<template>
<div>
<child-component @parentEvent="handleParentEvent"></child-component>
<p>{{ receivedValue }}</p>
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue';
export default {
components: { ChildComponent },
data() {
return { receivedValue: '' };
},
methods: {
handleParentEvent(value) {
this.receivedValue = value;
}
}
};
</script>
```