vue3 组合式api useSlots 获取元素

在 Vue3 中，可以使用组合式 API 中的 useSlots 函数来获取插槽内容，该函数返回一个对象，其中包含了所有插槽的内容。

下面是一个示例代码：

<template>
  <div>
    <slot name="header"></slot>
    <slot></slot>
    <slot name="footer"></slot>
  </div>
</template>

<script>
import { useSlots } from 'vue';

export default {
  setup(props, context) {
    const slots = useSlots();
    console.log(slots);

    return {
      slots,
    };
  },
};
</script>

在上面的代码中，我们定义了一个包含三个插槽的组件。在 setup 函数中，我们使用了 useSlots 函数来获取所有插槽的内容，并将其保存在 slots 变量中。然后我们可以在组件的模板中使用 slots 变量来渲染插槽内容。

注意：useSlots 函数只能在 setup 函数中使用。