• 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

    srcmain.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。

  • 相关阅读:
    Ruby编程语言学习笔记1
    SQL SERVER 2008 基础知识
    SQLServer批量插入数据的两种方法
    JQuery基础
    wpf首次项目开发技术总结之access数据库
    wpf首次项目开发技术总结wpf页面
    c#项目开发常见问题
    pl/sql基础
    wpf 开发应用初次总结
    博客园安家
  • 原文地址:https://www.cnblogs.com/zdz8207/p/vue-Element-UI-MintUI.html
Copyright © 2020-2023  润新知