1. Badge 徽章
<van-badge :content="5">
<div style="width: 40px; height: 40px; background-color: #eee;"></div>
</van-badge>
2. Collapse 折叠面板
<van-collapse v-model="activeNames">
<van-collapse-item title="标题1" name="1">
内容1
</van-collapse-item>
<van-collapse-item title="标题2" name="2">
内容2
</van-collapse-item>
</van-collapse>
3. Image 图片
<van-image width="100" height="100" fit="cover" src="图片地址" />
4. NoticeBar 通告栏
<van-notice-bar left-icon="info-o" color="#1989fa">
这是一条通知信息
</van-notice-bar>
5. Panel 面板
<van-panel title="标题">
内容
</van-panel>
6. Progress 进度条
<van-progress :percentage="60" />
7. Skeleton 骨架屏
<van-skeleton title :row="3" />
8. Steps 步骤条
<van-steps :active="1" finish-status="success">
<van-step>步骤1</van-step>
<van-step>步骤2</van-step>
<van-step>步骤3</van-step>
</van-steps>
9. Tag 标签
<van-tag type="primary">标签</van-tag>
10. Waterfall 瀑布流
<van-waterfall :column-count="2" :image-list="imageList" />
以上只是展示组件的一小部分，Vant 还包含许多其他组件，你可以根据项目需求选择合适的组件。确保你已经正确引入了 Vant 组件库，并按照其文档进行了配置。
转载请注明出处：http://www.zyzy.cn/article/detail/5677/Vant