Vue3没有$parent，怎么拿到父组件

在 Vue 3 中，可以使用 `emits` 和 `provide` / `inject` 来实现与父组件的通信，而不再依赖 `$parent` 属性。

一种常见的方式是使用 `emits` 和事件来触发和监听父组件的事件。父组件可以通过 `@eventName` 的方式监听子组件触发的事件，子组件通过 `$emit('eventName', payload)` 来触发事件，并将需要传递给父组件的数据作为 payload 参数。

另一种方式是使用 `provide` 和 `inject`，类似于前面提到的方式。父组件通过 `provide` 提供数据，子组件通过 `inject` 来接收并使用这些数据。这种方式适用于需要在多个嵌套层级中传递数据的情况。

以下是示例代码，展示了如何在 Vue 3 中获取父组件的方式：

// 父组件
const ParentComponent = {
  emits: ['eventFromParent'],
  methods: {
    triggerEvent() {
      this.$emit('eventFromParent', 'data from parent');
    }
  },
  // ...
};

// 子组件
const ChildComponent = {
  inject: ['eventFromParent'],
  mounted() {
    console.log(this.eventFromParent); // 输出：data from parent
  },
  // ...
};

在父组件中，通过 `emits` 声明了一个要触发的事件。通过 `this.$emit('eventFromParent', 'data from parent')` 触发了名为 `eventFromParent` 的事件，并传递了一个字符串作为数据。

在子组件中，通过 `inject` 注入了父组件提供的数据，并可以在组件中使用。在 `mounted` 钩子函数中，我们可以打印出 `eventFromParent` 的值，即父组件传递的数据。

通过这些方式，Vue 3 中可以在没有 `$parent` 的情况下实现与父组件的通信。你可以根据具体的需求和场景选择合适的方式来获取父组件的数据。