Vue-组件 vant 轻量、可靠的移动端 Vue 组件库

安装

基于 Vue Cli 3 安装 vant

# 通过 npm 安装

npm i vant -S

# 通过 yarn 安装

yarn add vant

引入组件

引入所有组件(不推荐)

Vant 支持一次性导入所有组件,引入所有组件会增加代码包体积,因此不推荐这种做法

在 main.ts 文件中

import Vant from 'vant';

import 'vant/lib/index.css';

Vue.use(Vant);

按需引入(推荐)

在 main.ts 中引入 Css 文件

import 'vant/lib/index.css';

在想要使用组件的页面引入组件

import { Button } from "vant";

components 注册组件

[Button.name]: Button

HTML中使用组件即可

<van-button type="info">信息按钮</van-button>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容