vant3,vant-cli,vant ts,vant step,vant 教程,vant入门
Vant4 是一款基于 Vue.js 的移动端 UI 组件库，它提供了丰富的组件和基于业务场景的解决方案，可以帮助开发者快速构建高质量的移动应用。

Vant4 提供了多种常见的移动端 UI 组件，如按钮、表单、导航栏、轮播图、下拉刷新等。这些组件都具有良好的交互体验和可定制性，可以满足不同项目的需求。

除了组件之外，Vant4 还提供了一些针对特定业务场景的解决方案，如商城场景的商品列表、购物车、下单流程等。这些解决方案会将多个组件组合在一起，形成一个完整的页面或者功能模块，开发者只需要简单配置即可使用。

以下是 Vant4 中一些常见组件的例子：

1. 按钮组件

html
<van-button type="primary" plain>主要按钮</van-button>
<van-button type="default" plain>默认按钮</van-button>


2. 表单组件

html
<van-cell-group>
<van-field label="用户名" v-model="username" />
<van-field label="密码" type="password" v-model="password" />
</van-cell-group>


3. 导航栏组件

html
<van-nav-bar title="首页" left-text="返回" @click-left="onLeftClick" />


4. 轮播图组件

html
<van-swipe :autoplay="3000">
<van-swipe-item><img src="image1.png" /></van-swipe-item>
<van-swipe-item><img src="image2.png" /></van-swipe-item>
<van-swipe-item><img src="image3.png" /></van-swipe-item>
</van-swipe>


5. 下拉刷新组件

html
<van-pull-refresh @refresh="onRefresh">
<div v-for="item in list">{{ item }}</div>
</van-pull-refresh>