[Bug][Carousel]组件在JSX下子节点无法渲染文本内容

[yangtianxia]

• I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.2.20

Environment

chrome浏览器、Vue3-v3.3.4

Reproduction link

Steps to reproduce

目前出现问题的情况，使用vue3 jsx开发就会出现无法渲染子节点的情况

import { Carousel } from "ant-design-vue";
import { defineComponent } from "vue";

export default defineComponent({
  setup() {
    const list = [{ title: "1-1" }, { title: "1-2" }];

    return () => (
      <Carousel>
        {list.map((item) => (
          <div key={item.title}>{item.title}</div>
        ))}
        <div>
          <h3>2</h3>
        </div>
        <div>
          <h3>3</h3>
        </div>
        <div>
          <h3>4</h3>
        </div>
      </Carousel>
    );
  }
});

目前当前解决办法是，使用vue的h方法创建一个虚拟 DOM 节点

import { Carousel } from "ant-design-vue";
import { defineComponent, h } from "vue";

export default defineComponent({
  setup() {
    const list = [{ title: "1-1" }, { title: "1-2" }];

    return () => (
      <Carousel>
        {list.map((item) => (
          <div key={item.title}>{h("h3", item.title)}</div>
        ))}
        <div>
          <h3>2</h3>
        </div>
        <div>
          <h3>3</h3>
        </div>
        <div>
          <h3>4</h3>
        </div>
      </Carousel>
    );
  }
});

正常使用vue模板开发模式不会出现问题

<template>
  <a-carousel :after-change="onChange">
    <div><h3>1</h3></div>
    <div><h3>2</h3></div>
    <div><h3>3</h3></div>
    <div><h3>4</h3></div>
  </a-carousel>
</template>
<script>
const onChange = current => {
  console.log(current);
};
</script>
<style scoped>
/* For demo */
:deep(.slick-slide) {
  text-align: center;
  height: 160px;
  line-height: 160px;
  background: #364d79;
  overflow: hidden;
}

:deep(.slick-slide h3) {
  color: #fff;
}
</style>

What is expected?

修复Carousel组件slide节点无法渲染文本内容bug

What is actually happening?

组件子节点无法渲染文本内容

[github-actions]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days