looped elements in slot only shown as one element
Version
3.0.0-rc.10
Reproduction link
https://jsfiddle.net/8fx5kjh3/
Steps to reproduce
Elements created by a for loop will shown in the slot return as one element. So Image is a Element with child == image.length and the div block:
<CardFlex class="images">
<Image v-for="(image, index) of this.images" :key="index" :image="image" />
<div><span></span></div>
</CardFlex>
<script>
import {h} from 'vue';
export default {
render() {
console.log('slot');
console.log(this.$slots);
const childs = this.$slots.default().map((child) => h('li',{}, [child]));
console.log(childs)
return h('ul',{}, childs);
}
}
</script>
What is expected?
I already use it in Vue 2.x and there I get each element as child of the slot. So I got for 4 images in this constellation 5 li elements with content (4 images 1 div)
What is actually happening?
Currently I have two li elements, one with 4 images and one with the div