在 Vue 中，子组件向父组件传值可以通过自定义事件和父组件监听子组件触发的事件来实现。
下面是一个示例，展示了子组件向父组件传递数据的方法：
父组件：
```vue
<template>
<div>
<h1>父组件</h1>
<p>子组件传递的值: {{ childData }}</p>
<ChildComponent @childEvent="handleChildEvent" />
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue';
export default {
components: {
ChildComponent
},
data() {
return {
childData: ''
};
},
methods: {
handleChildEvent(data) {
this.childData = data;
}
}
}
</script>
```
子组件：
```vue
<template>
<div>
<h2>子组件</h2>
<button @click="sendData">传递数据给父组件</button>
</div>
</template>
<script>
export default {
methods: {
sendData() {
const data = 'Hello, Parent!';
this.$emit('childEvent', data);
}
}
}
</script>
```
在上述示例中，父组件通过在子组件标签上使用 `@childEvent` 监听自定义事件 `childEvent`，并在触发时调用 `handleChildEvent` 方法来接收传递的数据。子组件在按钮的点击事件中，通过 `this.$emit('childEvent', data)` 来触发自定义事件，并传递数据给父组件。
当子组件触发自定义事件时，父组件的 `handleChildEvent` 方法会被调用，并将子组件传递的数据赋值给 `childData` 数据属性。父组件可以在模板中直接使用 `childData` 来显示子组件传递的值。
通过这种方式，子组件可以将数据传递给父组件，实现组件间的通信。