当前位置: 首页 > 软件库 > 程序开发 > UI组件库 >

Vant

基于 Vue 2.0 的 Mobile 组件库
授权协议 MIT
开发语言 JavaScript
所属分类 程序开发、 UI组件库
软件类型 开源软件
地区 国产
投 递 者 吕永嘉
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

Vant 是有赞前端团队开源的移动端组件库,于 2016 年开源,已持续维护 4 年时间。Vant 对内承载了有赞所有核心业务,对外服务十多万开发者,是业界主流的移动端组件库之一。

目前 Vant 官方提供了 Vue 版本微信小程序版本,并由社区团队维护 React 版本

特性

  • 性能极佳,组件平均体积小于 1KB(min+gzip)
  • 65+ 个高质量组件,覆盖移动端主流场景
  • 使用 TypeScript 编写,提供完整的类型定义
  • 单元测试覆盖率超过 90%,提供稳定性保障
  • 提供完善的中英文文档和组件示例
  • 提供 Sketch 和 Axure 设计资源
  • 支持 Vue 2、Vue 3 和微信小程序
  • 支持主题定制,内置 700+ 个主题变量
  • 支持按需引入和 Tree Shaking
  • 支持服务器端渲染
  • 支持国际化和语言包定制

轻量化

作为移动端组件库,Vant 一直将轻量化作为核心开发理念。为了平衡日益丰富的功能和轻量化之间的矛盾关系,Vant 内部使用了很多的优化方式,包括支持组件按需加载、公共模块复用、组件编译流程优化等。

在应用一系列的优化手段之后,目前 Vant 的组件平均体积仅有 8.8KB,Uglify + Gzip 后约 1KB。

丰富实用的业务组件

Vant 不只是提供基础的UI组件,为了方便开发者快速构建移动商城,Vant 增加了许多移动商城内常用的业务组件。类似于地址管理、优惠券、省市县选择等。

  • Vant是一个轻量,可靠的移动端组件库,2017开源 目前 Vant 官方提供了 [Vue 2 版本](https://vant-contrib.gitee.io/vant/v2)、[Vue 3 版本](https://vant-contrib.gitee.io/vant)和[微信小程序版本](http://vant-contrib.gitee.io/vant-weapp),并由社区团队维护 [R

  • Vant 什么是Vant Vant是一个轻量,可靠的移动端组件库,2017开源 目前 Vant 官方提供了 [Vue 2 版本](https://vant-contrib.gitee.io/vant/v2)、[Vue 3 版本](https://vant-contrib.gitee.io/vant)和[微信小程序版本](http://vant-contrib.gitee.io/vant-weapp

  • 一.介绍   1.Vant 是一个轻量、可靠的移动端组件库,于 2017 年开源。 2.目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本,并由社区团队维护 React 版本和支付宝小程序版本。 3.它对我们初学者来说简单快捷体积小,最重要的是它是全中文文档并且有PC端与移动端两个版本 二.快速上手 1.安装 (1)通过 npm 安装   在现有项目中使用 Vant 时

  • Vant是什么 简介 Vant是有赞开源的一套基于Vue2.0的Mobile组件库。通过Vant,可以快速搭建出风格统一的页面,提升开发效率。目前已有近50个组件,这些组件被广泛使用于有赞的各个移动端业务中。Vant旨在更快、更简单地开发基于Vue的美观易用的移动站点。特性组件都是来源于有赞的微商城业务,并且经过有赞业务的检验,更靠谱完善详实的中文文档专门的设计师团队维护视觉规范,统一而优雅支持b

  • Vant ( ˈvænt ) 是有赞前端团队基于有赞统一的规范实现的 Vue 组件库,提供了一整套 UI 基础组件和业务组件。 通过 Vant,可以快速搭建出风格统一的页面,提升开发效率。 目前已有近50个组件,这些组件被广泛使用于有赞的各个移动端业务中。 如果你需要开发一个移动商城,用 Vant 就再合适不过了。 npm i vant -S :这是简写形式。 npm install vant -

  • 一. 安装Vant组件库 1.通过npm安装 # Vue 3 项目,安装最新版 Vant npm i vant # Vue 2 项目,安装 Vant 2 npm i vant@latest-v2 二. 引入组件(推荐) 在基于 vite、webpack 或 vue-cli 的项目中使用 Vant 时,推荐安装 unplugin-vue-components 插件,它可以自动按需引入组件 1.安装

  • 目录 1.vant组件库-介绍 1.1 vant组件库安装 通过 npm 安装 2.组件用法 2.1全部引用 1.下载vant组件库到当前项目中  2.导入所有组件, 在main.js中   2.2手动按需引入  1.引入 2 注册 2.3自动按需引入  1.安装插件 2.在babel配置文件里 (babel.config.js) 3.全局注册 - 会自动按需引入 3.基础组件 3.1.Butto

  • vant官网:https://vant-contrib.gitee.io/vant/#/zh-CN/col # Vue 2 项目,安装 Vant 2: npm i vant -S # Vue 3 项目,安装 Vant 3: npm i vant@next -S 项目中main.js引入 import Vue from 'vue'; import Vant from 'vant'; import

  • Vant — 链接 https://vant-contrib.gitee.io/vant/#/zh-CN/home 跳转vant中文API 跳转vant API(方法二)

  • vant官网地址:https://vant-contrib.gitee.io/vant

  • https://youzan.github.io/vant/#/zh-CN/uploader vant官网入口找不到的来这里拿

 相关资料
  • 本文向大家介绍基于vue2.0实现的级联选择器,包括了基于vue2.0实现的级联选择器的使用技巧和注意事项,需要的朋友参考一下 基于Vue的级联选择器,可以单项,二级, 三级级联,多级级联 web开发中我们经常会遇到级联选择器的问题,尤其是在表单中,无外乎几种情况: 单个级联 (下拉选择框,单选) 单个级联 (多项选择) 二级联动 (省份和城市联动) 三级联动 (省市区联动) 在jquery中有

  • 如果您在声明组件时更喜欢基于类的 API,则可以使用官方维护的vue-class-component装饰器: import Vue from 'vue' import Component from 'vue-class-component' // @Component 修饰符注明了此类为一个 Vue 组件 @Component({ // 所有的组件选项都可以放在这里 template:

  • 本文向大家介绍bootstrap select插件封装成Vue2.0组件,包括了bootstrap select插件封装成Vue2.0组件的使用技巧和注意事项,需要的朋友参考一下 因为bootstrap-select功能比较强大,而且样式还不错,所以在项目使用了vue,所以,觉得对bootstrap-select进行封装。 html js 不得不提一下,在使用多个select的时候,在删除某一个s

  • vant的van-steps步骤条组件,已激活的线条怎么设置为渐变色 求求各位大佬们!!!!真的非常感谢, vant的van-steps步骤条组件,已激活的线条怎么设置为渐变色,如图:

  • 本文向大家介绍详解Vue2.0组件的继承与扩展,包括了详解Vue2.0组件的继承与扩展的使用技巧和注意事项,需要的朋友参考一下 前言 本文将介绍vue2.0中的组件的继承与扩展,主要分享slot、mixins/extends和extend的用法。 一、slot 1.默认插槽和匿名插槽 slot用来获取组件中的原内容,此方式用于父组件向子组件传递“标签数据”。有的时候为插槽提供默认的内容是很有用的,

  • 本文向大家介绍在vue2.0中引用element-ui组件库的方法,包括了在vue2.0中引用element-ui组件库的方法的使用技巧和注意事项,需要的朋友参考一下 在vue2.0中引用element-ui组件库 element-ui是由饿了么团队开发的一套基于 Vue 2.0 的桌面端组件库。 官网: http://element.eleme.io/ 安装 引用完整的element-ui 需要

  • 本文向大家介绍基于vue2.0+vuex+localStorage开发的本地记事本示例,包括了基于vue2.0+vuex+localStorage开发的本地记事本示例的使用技巧和注意事项,需要的朋友参考一下 本文采用vue2.0+vuex+localStorage+sass+webpack,实现一个本地存储的记事本。兼容PC端和移动端。 实现效果 功能说明 支持回车添加事件 支持事件状态切换 添加