mintUI

安装:

npm install mint-ui -S

引入:

// 按需引入部分组件

import { Cell, Checklist } from 'mint-ui';

Vue.component(Cell.name, Cell);

Vue.component(Checklist.name, Checklist);
/*引入mint  注册成标签(全局)*/
import { Header ,Swipe, SwipeItem } from 'mint-ui'
Vue.component(Header.name, Header)
Vue.component(Swipe.name, Swipe)
Vue.component(SwipeItem.name, SwipeItem)

使用:

<mt-header title="商城">
<router-link to="/" slot="left">
<mt-button icon="back"> < 返回</mt-button>
</router-link>
<mt-button icon="more" slot="right"></mt-button>
</mt-header>

mUI

下载代码例子,引入:

/*导入mui样式表*/
import './lib/mui/css/mui.css'
import './lib/mui/css/icons-extra.css'

使用:

 <nav class="mui-bar mui-bar-tab">
<router-link class="mui-tab-item" to="/home">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">首页</span>
</router-link>
<nav>

mintUI和mUI的更多相关文章

  1. 基于Mint UI和MUI开发VUE项目一之环境搭建和首页的实现

    一:简介 Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要.通过它,可以快速构建出风格统一的页面,提升开发效率.真正意义上的按需加载组件.可以只加载声明过的组件及其样式 ...

  2. Vue(day7)

    一.环境搭建 下面我们需要为后面要做的Vue项目搭建开发环境. 1.基本的运行环境 该项目使用node& vue在webpack环境下进行开发.首先安装基本的模块文件: npm install ...

  3. 基于Vue的WebApp项目开发(六)

    实现商品购买列表页面 步骤一:新建goodslist.vue文件 <template> <div id="tml"> <!--利用mui中的图文表格组 ...

  4. 基于Vue的WebApp项目开发(五)

    实现图片分享列表 步骤一:新增图片列表文件photolist.vue <template> <div id="tml"> 图片分享页面 </div&g ...

  5. 基于Vue的WebApp项目开发(四)

    实现新闻咨询页面 目录结构 步骤一:创建newslist.vue文件 <template> <div id="tml"> <!--使用mui框架,实现 ...

  6. 基于Vue的WebApp项目开发(三)

    实现根组件通用的头部和底部样式 明白由webpack搭建起来的Vue项目的执行流程,那么就可以知道实现这个需要只要在根组件和入口文件上做“手脚”即可 <!--以后项目的根组件--> < ...

  7. Vue PC端框架

    Vue PC端框架 1. Element 中文文档:http://element-cn.eleme.io/#/zh-CN github地址:https://github.com/ElemeFE/ele ...

  8. Vue笔记(有点乱)

    Vue学习笔记(2019.7.31) 目录 Vue学习笔记(2019.7.31) vue 基本指令用法 v-cloak v-text v-html v-bind v-on 跑马灯 v-on v-mod ...

  9. iView webapp / Mint UI / MUI [前端UI]

    前端UI iView webapp一套高质量的 微信小程序 UI 组件库 https://weapp.iviewui.com/?from=iview Mint UI 基于 Vue.js 的移动端组件库 ...

随机推荐

  1. 【论文学习】Blind Super-resolution Image Reconstruction Based On Novel Blur Type Identification

    机翻 <基于新型模糊类型识别的盲超分辨率图像重建>

  2. eclipse syso 自动补全设置方法

    eclipse syso 自动补全设置方法   转  https://blog.csdn.net/sinat_23536373/article/details/76512390   经常遇到打”sys ...

  3. visible,invisible和GONE的区别

    在Android开发中,大部分控件都有visibility这个属性,其属性有3个分别为“visible ”.“invisible”.“gone”.主要用来设置控制控件的显示和隐藏.有些人可能会疑惑In ...

  4. 分析Python中解析构建数据知识

    分析Python中解析构建数据知识 Python 可以通过各种库去解析我们常见的数据.其中 csv 文件以纯文本形式存储表格数据,以某字符作为分隔值,通常为逗号:xml 可拓展标记语言,很像超文本标记 ...

  5. Redis的大白话解释

    Redis的官方解释可以百度,这里讲redis缓存为啥速度非常快! 这么说吧,别人问你什么是“redis”,如果你知道,你可以直接吧啦吧啦一大堆,其实这个时候你的大脑就类似redis缓存,别人问的“r ...

  6. Element-UI 框架 el-scrollbar 组件

    Element-UI 框架 el-scrollbar 组件:https://juejin.im/post/5c83d5ac5188257e1c4dc9e7

  7. spy++工具

    vs工具的spy++和第三方spy4win工具下载地址: https://files.cnblogs.com/files/zhangmo/spytools.rar https://files.cnbl ...

  8. 分布式系统/NoSQL

    分布式系统概念与架构:https://www.cnblogs.com/JonaLin/category/1555338.html 分布式缓存 redis系列:https://blog.csdn.net ...

  9. 小记--------spark的宽依赖与窄依赖分析

    窄依赖: Narrow Dependency : 一个RDD对它的父RDD,只有简单的一对一的依赖关系.RDD的每个partition仅仅依赖于父RDD中的一个partition,父RDD和子RDD的 ...

  10. 【LOJ】#3033. 「JOISC 2019 Day2」两个天线

    LOJ#3033. 「JOISC 2019 Day2」两个天线 用后面的天线更新前面的天线,线段树上存历史版本的最大值 也就是线段树需要维护历史版本的最大值,后面的天线的标记中最大的那个和最小的那个, ...