vue使用桌面Element-UI和移动端MintUI的UI框架

vue使用桌面Element-UI和移动端MintUI的UI框架

element-ui
Element - 网站快速成型工具
http://element-cn.eleme.io/#/zh-CN

安装：npm install --save element-ui

src\main.js添加
// 引入Element ui
import ElementUI from 'element-ui';
import '../static/theme/index.css';
Vue.use(ElementUI)

*.vue文件模版里使用
<el-input class="register-input transaction-password graphical"></el-input>

---------------
Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架，手机移动端有对应框架是 Mint UI 。
pc端和手机端的UI还是完全不一样的

基于vue.js的移动端UI框架mint-ui
https://mint-ui.github.io/#!/zh-cn
MintUI使用文档vue2
https://mint-ui.github.io/docs/#/zh-cn2

注意：这个是https开头的，http开头的经常会打不开。

// 安装
# 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);

Mint UI 包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要。通过它，可以快速构建出风格统一的页面，提升开发效率。

真正意义上的按需加载组件。可以只加载声明过的组件及其样式文件，无需再纠结文件体积过大。

考虑到移动端的性能门槛，Mint UI 采用 CSS3 处理各种动效，避免浏览器进行不必要的重绘和重排，从而使用户获得流畅顺滑的体验。

依托 Vue.js 高效的组件化方案，Mint UI 做到了轻量化。即使全部引入，压缩后的文件体积也仅有 ~30kb (JS + CSS) gzip。

 

转载于:https://www.cnblogs.com/zdz8207/p/vue-Element-UI-MintUI.html