const { userData } = this.$parent; 父组件如何传值给子组件

`const { userData } = this.$parent;` 这行代码是在 Vue.js 中使用的，它表示从父组件 (`this.$parent`) 中获取名为 `userData` 的数据属性。Vue 中，父组件通过 props（属性）机制将数据向下传递给子组件。`{}` 符号用于解构赋值，这样在子组件中可以直接访问到父组件的数据。

父组件可以这样做：

<!-- 父组件 -->
<template>
  <div>
    <child-component :userData="parentData" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      parentData: {/* 父组件的数据 */}
    };
  },
};
</script>

然后在子组件 `ChildComponent.vue` 中接收这个数据：

<!-- 子组件 ChildComponent.vue -->
<template>
  <div>{{ userData }}</div>
</template>

<script>
import { mapProp } from 'vue';
export default {
  computed: {
    ...mapProp('userData', {
      // 如果 userData 是动态变化的，也可以使用 deep 或者 default
      deep: true,
    }),
  },
};
</script>

这样，子组件就能通过 `userData` 访问并显示父组件传递过来的数据了。