Vue 中使用 vant

Vant 是有赞前端团队基于有赞统一的规范实现的 Vue 组件库,提供了一整套 UI 基础组件和业务组件。通过 Vant,可以快速搭建出风格统一的页面,提升开发效率。

Vant 3 适用于 Vue3
Vant 2 适用于 Vue2

安装 Vant

# Vue 3 项目,安装最新版 Vant:
npm i vant -S // 这是简写形式

# Vue 2 项目,安装 Vant 2:
npm i vant@latest-v2 -S 

手动按需引入组件

import { Button, Icon } from 'vant'
import 'vant/lib/button/style';
export default {
  components: {
    [Button.name]: Button,
    [Icon.name]: Icon
  }
}

使用

<van-button type="primary">主要按钮</van-button>
<van-icon name="chat-o" dot />

你可能感兴趣的:(#,Vue,2.x,vue.js,javascript,前端)