子组件中点击切换的值，传递到父组件中

要将子组件中的数据传递到父组件中，可以通过在子组件中定义一个事件并在父组件中监听该事件的方式实现。

首先，子组件中需要定义一个事件，并在该事件中将需要传递给父组件的数据作为参数传递进去，例如：

<template>
  <div @click="handleClick">{{ value }}</div>
</template>

<script>
export default {
  props: {
    value: String
  },
  methods: {
    handleClick() {
      this.$emit('change', 'new value');
    }
  }
}
</script>

在这个例子中，子组件中定义了一个 `handleClick` 方法，当子组件被点击时，会触发该方法，并通过 `$emit` 方法触发一个名为 `change` 的自定义事件，并将字符串 `'new value'` 作为该事件的参数传递进去。

然后，在父组件中监听该事件，并在事件处理函数中获取子组件传递过来的数据，例如：

<template>
  <div>
    <child-component :value="value" @change="handleChange"></child-component>
    <p>Value in parent component: {{ value }}</p>
  </div>
</template>

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

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      value: 'initial value'
    }
  },
  methods: {
    handleChange(newValue) {
      this.value = newValue;
    }
  }
}
</script>

在这个例子中，父组件中引入了子组件，并通过 `@change` 监听了子组件中触发的 `change` 事件。当子组件触发该事件时，会自动调用父组件中的 `handleChange` 方法，并将子组件传递过来的字符串 `'new value'` 作为参数传递给该方法。在 `handleChange` 方法中，我们将父组件中的 `value` 数据更新为子组件传递过来的新值。最后，父组件会渲染出一个包含当前 `value` 值的 `<p>` 元素。