vant组件,vant-cli,vant3,vant ui,vant tabs,vant组件官网
Vant4 组合式 API 是一个 Vue.js 组件库 Vant 4 中的新特性，它允许开发者基于已有组件快速构建出新的组件，从而提高开发效率和代码可复用性。

Vant4 组合式 API 提供了一些函数和钩子来帮助我们将已有组件组合成新的组件。例如，createNamespace、useChild、useParent 等函数，以及 useExpose 钩子等。通过这些函数和钩子，我们可以更加灵活地组织组件之间的关系，减少重复代码，并且使组件的 API 更加清晰易用。

以下是一个简单的例子，使用 Vant4 组合式 API 将 Swipe 和 SwipeItem 组件组合成一个新的 Carousel 组件：

vue
<template>
<van-swipe :autoplay="autoplay">
<van-swipe-item v-for="(item, index) in list" :key="index">
<slot name="item" :data="item"></slot>
</van-swipe-item>
</van-swipe>
</template>

<script>
import { createNamespace, useChild } from 'vant';

const [name, bem] = createNamespace('carousel');

export default {
name,

props: {
autoplay: Boolean,
initialIndex: Number,
},

setup(props, { emit }) {
const { linkChildren } = useChild('swipe');

linkChildren({
onSwipe: emit.bind(null, 'change'),
});

return {
list: [],
};
},
};
</script>


在这个例子中，我们通过 createNamespace 函数创建了一个 Carousel 组件，并且使用 useChild 钩子获取了 Swipe 组件的实例，从而可以在子组件中监听 Swipe 的事件。同时，我们也定义了一些 props 和 setup 函数，使得 Carousel 组件更加灵活和易用。