Vant 教程

特性 提供 60 多个高质量组件，覆盖移动端各类场景 性能极佳，组件平均体积不到 1kb（min+gzip） 单元测试覆盖率 90%+，提供稳定性保障 完善的中英文文档和示例 支持…

介绍 Vant 遵循 Semver 语义化版本规范。 发布节奏 修订号：每周发布，包含新特性和问题修复。 次版本号：每隔一至二个月发布，包含新特性和较大的功能更…

介绍 Vant 提供了一套默认主题，CSS 命名采用 BEM 的风格，方便使用者覆盖样式。如果你想完全替换主题色或者其他样式，可以使用下面提供的方法。 示例工程 我们提供了一个基于…

介绍 感谢你使用 Vant。 以下是关于向 Vant 提交反馈或代码的指南。在向 Vant 提交 issue 或者 PR 之前，请先花几分钟时间阅读以下文字。 Issue 规范 遇…

介绍 这里提供了 Vant 现有的设计资源，更多资源还在整理中。 组件 包含 Sketch 格式的组件设计规范、色彩规范。 下载 提示：目前 Sketch 中部分组件仍为旧版样式，…

介绍 Vant 默认采用中文作为语言，如果需要使用其他语言，可以参考下面的方案。 多语言切换 Vant 通过 Locale 组件实现多语言支持，使用 Locale.use…

引入 import Vue from vue; import { Button } from vant; Vue.use(Button); 代码演示 按钮类型 支持default、…

引入 import Vue from vue; import { Cell, CellGroup } from vant; Vue.use(Cell); Vue.use(CellG…

介绍 基于字体的图标集，可以通过 Icon 组件使用，也可以在其他组件中通过icon属性引用 引入 import Vue from vue; import { Icon }…

介绍 Layout 提供了van-row和van-col两个组件来进行行列布局 引入 import Vue from vue; import { Col, Row } from v…

介绍 弹出层容器，用于展示弹窗、信息提示等内容，支持多个弹出层叠加展示 引入 import Vue from vue; import { Popup } from vant; Vu…

介绍 Vant 中默认包含了一些常用样式，可以直接通过 className 的方式使用。 文字省略 当文本内容长度超过容器最大宽度时，自动省略多余的文本。 <!– 最多显示…

介绍 日历组件用于选择日期或日期区间，2.4 版本开始支持此组件 引入 import Vue from vue; import { Calendar } from vant; Vu…

介绍 时间选择器，支持日期、年月、时分等维度，通常与 弹出层 组件配合使用 引入 import Vue from vue; import { DatetimeP…

介绍 表单中的输入框组件 引入 import Vue from vue; import { Field } from vant; Vue.use(Field); 代码演示 基础用法…

介绍 数字键盘，提供两种样式风格，可以与密码输入框或自定义的输入框组件配合使用 引入 import Vue from vue; import { NumberKeyboard } …

介绍 带网格的输入框组件，可以用于输入支付密码、短信验证码等，通常与数字键盘组件配合使用 引入 import Vue from vue; import { PasswordInpu…

fa引入 import Vue from vue; import { RadioGroup, Radio } from vant; Vue.use(Radio); Vue.use(…

引入 import Vue from vue; import { Rate } from vant; Vue.use(Rate); 代码演示 基础用法 <van-rate v…

引入 import Vue from vue; import { Search } from vant; Vue.use(Search); 代码演示 基础用法 v-model 用于…