Vue:UI组件框架推荐

说明

本节说明的是针对基于Vue.js的UI组件库
- 推荐:ElementUi,MintUI,iView

PC端
- ElementUI :饿了么UI开源的
- iView
移动端
- mintUI :饿了么UI开源的

1、ElementUI

1、 安装
    npm install element-ui -D
2、引入main.js
    import ElementUI from 'element-ui'
    // 注意引入css,需要css-loader加载器,以及对应字体图标需要使用file-loader
    import 'element-ui/lib/theme-chalk/index.css'
3、注册全局组件
    Vue.use(ElementUI)

4、组件内部使用
<template>
    <div>
        <el-button type="primary">主要按钮</el-button>
    </div>
</template>

2、MintUI

  • 官方文档:mintUI
  • MintUI是饿了么推出的针对移动端的一套UI实现,其用法与element类似,都是组件化的使用。
// 安装
# Vue 1.x
npm install mint-ui@1 -S
# Vue 2.0
npm install mint-ui -S

// 引入全部组件
import Vue from 'vue';
import Mint from 'mint-ui';
Vue.use(Mint);

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

猜你喜欢

转载自blog.csdn.net/Sophie_U/article/details/80000255