vue子组件向父组件传值

Vue中，子组件向父组件传值的方法有以下几种：

1. 通过事件传值

子组件可以通过$emit方法触发一个自定义事件，父组件可以通过v-on指令监听该事件，并在事件处理函数中获取传递过来的值。

子组件中：

methods: {
  handleClick() {
    this.$emit('child-event', 'hello')
  }
}

父组件中：

<template>
  <div>
    <my-child @child-event="handleChildEvent"></my-child>
  </div>
</template>

<script>
import MyChild from './MyChild.vue'

export default {
  components: {
    MyChild
  },
  methods: {
    handleChildEvent(value) {
      console.log(value) // 'hello'
    }
  }
}
</script>

2. 通过props传值

子组件可以通过props属性接收父组件传递过来的数据。

子组件中：

<template>
  <div>{{ value }}</div>
</template>

<script>
export default {
  props: {
    value: {
      type: String,
      default: ''
    }
  }
}
</script>

父组件中：

<template>
  <div>
    <my-child :value="message"></my-child>
  </div>
</template>

<script>
import MyChild from './MyChild.vue'

export default {
  components: {
    MyChild
  },
  data() {
    return {
      message: 'hello'
    }
  }
}
</script>

以上两种方法都可以实现子组件向父组件传值，具体选择哪种方法，取决于具体的场景和需求。