<template>
<div>
<!-- 使用 van-list 组件 -->
<van-list>
<!-- van-list-item 是列表的每一项 -->
<van-list-item title="标题1" />
<van-list-item title="标题2" />
<van-list-item title="标题3" />
<!-- 也可以添加更多的 van-list-item -->
</van-list>
</div>
</template>
<script>
export default {
setup() {
// 这里可以添加组件的相关逻辑
return {};
},
};
</script>
<style>
/* 这是一个简单的样式示例，你可以根据需求自定义样式 */
</style>
在上述代码中，我们使用了 van-list 组件，并在其中使用了 van-list-item 组件创建了列表的每一项。你可以在 van-list-item 中设置 title 属性来显示标题内容。
如果需要在列表项之间添加分割线，可以在 van-list 组件中使用 hairline 属性，设置为 true。
确保你的项目已经正确引入了 Vant3 并按照文档配置，以确保组件能够正常工作。
转载请注明出处：http://www.pingtaimeng.com/article/detail/5752/Vant