前端

Vue移动端UI框架

StoneLee 发布于 文章字数: 359 阅读次数: 次

Vant

Vant，轻量、可靠的移动端 Vue 组件库。

安装方法
1
2
3
4
5
6
7
# 通过 npm 安装
npm i vant -S

或

# 通过 yarn 安装
yarn add vant

Cube UI

Cube UI 滴滴开源的基于 Vue.js 实现的移动端组件库

安装方法
1
npm install cube-ui --save
引入组件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 引入全部组件
import Vue from 'vue'
import Cube from 'cube-ui'

Vue.use(Cube)

// 按需引入部分组件
import Vue from 'vue'
import {
  /* eslint-disable no-unused-vars */
  Style,
  Button,
  ActionSheet
} from 'cube-ui'

Vue.use(Button)
Vue.use(ActionSheet)

Mint UI

Mint UI 基于 Vue.js 的移动端组件库

安装方法
1
2
3
4
5
# Vue 1.x
npm install mint-ui@1 -S

# Vue 2.0
npm install mint-ui -S
引入组件
1
2
3
4
5
6
7
8
9
// 引入全部组件
import Vue from 'vue';
import Mint from 'mint-ui';
Vue.use(Mint);

// 按需引入部分组件
import { Cell, Checklist } from 'mint-ui';
Vue.component(Cell.name, Cell);
Vue.component(Checklist.name, Checklist);

Mand Mobile 2

Mand Mobile 面向金融场景的Vue移动端UI组件库，丰富、灵活、实用，快速搭建优质的金融类产品，让复杂的金融场景变简单。

安装方法
1
2
3
npm install mand-mobile --save
# OR 
yarn add mand-mobile

vue-beauty

vue-beauty 是一套基于 vue.js 和 ant-design样式 的PC端 UI 组件库，旨在帮助开发者提升产品体验和开发效率、降低维护成本。

特性
  • 丰富的组件，涵盖常用场景
  • 基于vue组件化开发，数据驱动视图
  • 封装复杂性，提供简单友好的api
  • 基于ant design样式优化