Как использовать useSlots().default() vue3 внутри script setup?

Question

[Crone01]

у меня есть условный компонент, внутри которого хранятся slot (далее в slot попадает другой компонент, имеющий пропсы)

мне необходимо использовать useSlots().default(), чтобы узнать их props и выполнить определенную логику

при запуске юнит тестов, вью ругается

Slot "default" invoked outside of the render function: this will not track dependencies used in the slot. Invoke the slot function inside the render function instead.

о какой рендер функции идет речь?

саму логику пишу используя синтаксис script setup

краткий пример компонента:

<template>
    <div>
            <slot></slot>
    </div>
</template>

<script setup lang="ts">
import {useSlots} from 'vue';
import type {Slot} from 'vue';

const slots = useSlots().default();
</script>

Comments

[Антон Антон]

ничего не понятно, но

const slots = useSlots()
const defaultSlot = slots.default

[Антон Антон]

А для пробрасывания произвольных слотов внутрь компонента (наследование компонентов) код вообще не нужен, нужен примерно такой шаблон:

<inner-component v-bind="$props" :>
    <template v-for="(_, slot) of $slots" v-slot:[slot]="scope">
      <slot :name="slot" v-bind="scope"></slot>
    </template>
</inner-component>

[Crone01]

Антон Антон, мне нужен slots именно в коде, а не шаблоне

[Crone01]

default - это же функция?

const slots = useSlots()
const defaultSlot = slots.default

ну и в принципе ничего не изменилось же

Answer 1

[Aetae]

о какой рендер функции идет речь?

render-function

Это более низкоуровневый вариант работы с vue, вместо использования <template>.(под капотом <template> компилируется в render-функцию)

Render-функцию можно возвращать из setup, можно класть в свойство render.
При script setup, можно сделать так:

<template>
  <div>
    <render/>
  </div>
</template>

<script setup lang="ts">
  import { h, useSlots } from 'vue'

  const slots = useSlots();
  const render = () => {
    return h('div', slots.default());
  };
</script>

Но не нужно в подавляющем большинстве случаев. Мешать всё в одну кучу - весьма опасно.