vue子组件向父组件传值

Vue 中子组件向父组件传值可以使用自定义事件（Custom Event）。下面是一个简单的示例：

在子组件中，使用 `$emit` 方法触发一个自定义事件，并将需要传递的数据作为参数传入：

<template>
  <button @click="sendDataToParent">Send Data to Parent</button>
</template>

<script>
export default {
  methods: {
    sendDataToParent() {
      const data = 'Hello, parent!';
      this.$emit('send-data', data);
    }
  }
};
</script>

在父组件中，使用 `v-on` 指令监听子组件触发的自定义事件，并在方法中接收传递的数据：

<template>
  <div>
    <child-component @send-data="getDataFromChild" />
    <p>Data from child: {{ dataFromChild }}</p>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      dataFromChild: ''
    };
  },
  methods: {
    getDataFromChild(data) {
      this.dataFromChild = data;
    }
  }
};
</script>

在上面的示例中，子组件中使用 `$emit` 方法触发了一个名为 `send-data` 的自定义事件，并将字符串 `'Hello, parent!'` 作为数据传递给了父组件。

父组件中使用 `v-on` 指令监听了名为 `send-data` 的自定义事件，并在 `getDataFromChild` 方法中接收了传递的数据，并将其赋值给了 `dataFromChild` 数据属性。

这样，当子组件中触发了 `send-data` 自定义事件时，父组件中的 `getDataFromChild` 方法就会被调用，从而实现了子组件向父组件传递数据的功能。