Mint UI 正在参加 2021 年度 OSC 中国开源项目评选,请投票支持!
Mint UI 在 2021 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
2021 年度 OSC 中国开源项目评选 正在火热进行中,快来投票支持你喜欢的开源项目!
2021 年度 OSC 中国开源项目评选 >>> 中场回顾
Mint UI 获得 2021 年度 OSC 中国开源项目评选「最佳人气项目」 !
授权协议 MIT
操作系统 跨平台
软件类型 开源软件
开源组织
地区 国产
投 递 者 狗头666
适用人群 未知
收录时间 2016-07-19

软件简介

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

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

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

依托 Vue.js 高效的组件化方案,Mint UI 做到了轻量化。即使全部引入,压缩后的文件体积也仅有 100+ K。

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论 (5)

加载中
打分: 力荐
框架使用什么工具?(小白一枚)
2017/09/12 11:49
回复
举报
换颜色要改框架本身的样式?
2017/08/30 17:18
回复
举报
打分: 力荐
很奇葩的是clone下来的代码无法运行…… 但是在Vue-cli安装时没问题的。回答楼上文档不符合的问题,直接看mint-ui项目的example的诸多示例就好了,配合文档就清楚多了。
2017/02/20 14:43
回复
举报
打分: 力荐
demo与文档不符,好需要那个demo源码
2017/01/21 16:56
回复
举报
基于Vue.js的UI组件库 #Mint UI#
2016/07/19 16:48
回复
举报
更多评论
暂无内容
发表了博客
2019/03/02 11:45

mint-ui----mint-ui的基本使用

mint-ui的使用: 1、安装cnpm i mint-ui -S 或直接使用以下的cdn托管: <!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css"> <!-- 引入组件库 --> <script src="https://unpkg.com/mint-ui/lib/index.js"></script> 2、安装后导入文件: import MintUI from 'mint-ui' import 'mint-ui/lib/style.css' 3、注意:自定义组件绑定原生事件必须使用 .native 修饰符,只有button组件可以直接...

0
0
发表了博客
2018/08/13 20:06

Mint UI文档

Mint UI文档:http://elemefe.github.io/mint-ui/#/ 一、Mint UI的安装和基本用法。 1.NPM :npm i mint-ui -S 建议使用npm进行安装,因为它可以与webpack无缝协作。 2.CDN:从unpkg.com/mint-ui获取最新版本,并在您的页面中导入JavaScript和CSS文件 <!-- import CSS --> <link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css"> <!-- import JavaScript --> <script src="https://unpkg.com/mint-ui/lib/inde...

0
0
发表了博客
2019/04/01 16:39

手把手教Mint-ui

转自:https://www.jianshu.com/p/db776b507065 教程简介 1、阅读对象 本篇教程适合新手阅读,老手直接略过 2、教程难度 初级,本人水平有限,文章内容难免会出现问题,如果有问题欢迎指出,谢谢 3、Demo 地址:https://github.com/githubchen001/vue-lesson 查看 08、Mint-UI的使用 正文 一、什么是 Mint UI 当我们一听到 XX UI 就可以知道它是一个界面相关的框架,玩过前端的人至少听说过 Bootstrap「它是 Twitter 开源的一个...

0
0
发表了博客
2019/01/04 11:49

Mint UI Example的运行

Mint -UI是新推出的移动端UI框架 官网 不过官网上的文档例子不是很全面。 建议下载他们提供的example来学习。 1.examplle源码下载地址 2.打开项目,我这里使用webstorm, 然后按提示安装npm install 依赖 3.运行npm run dev ,不过发现有报错“ Missing radix parameter”,点击连接查看原因以及解决办法 4.最后得到的是以下信息,表面打包有效。 但是,访问地址,要怎么在浏览器上访问呢? 要更改配置,如下: 即将 host: requir...

0
0
发表了博客
2018/02/06 14:48

mint-ui之Swipe使用

<template> <div> <div class="swipe-wrapper"> <mt-swipe :auto="1000" ref="swipeWrapper"> <mt-swipe-item class="swip-item-1 item">1</mt-swipe-item> <mt-swipe-item class="swip-item-2 item">2</mt-swipe-item> <mt-swipe-item class="swip-item-3 item">3</mt-swipe-item> </mt-swipe> </div> <div class="button-wrapper"> <button class="prev-button flex-item" @cl...

0
0
发表了博客
2018/04/28 16:21

mint-ui Picker的使用

<template> <div v-bind:style="{minHeight:clientHeight + 'px'}" id="recive-min-body"> <mt-header title="我的赞"> <mt-button icon="back" slot="left" @click.native="goBack">返回</mt-button> </mt-header> <form> <h3 class="recive-min-input">请填写以下信息:</h3> <mt-field label="你要点赞给" placeholder="巩一杰" @click.native="handleClick"></mt-field> <...

0
0
发表了博客
2018/02/06 14:34

mint-ui之tabbar使用

<template> <div> <!-- tabcontainer --> <mt-tab-container class="page-tabbar-container" v-model="selected"> <mt-tab-container-item id="tab1"> tab1 </mt-tab-container-item> <mt-tab-container-item id="tab2"> tab2 </mt-tab-container-item> <mt-tab-container-item id="tab3"> tab3 </mt-tab-container-item> <mt-tab-conta...

0
0
发表了博客
2019/08/22 15:02

mint-ui中messagebox的使用

效果图: 代码: // 安装 # 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 'mint-ui'; Vue.component(Cell.name, Cell); Vue.component(Checklist.name, Checklist); //删除弹框 handledelete(){ this.$messagebox({   ...

0
0
发表了博客
2019/03/19 22:26

mint-ui loadmore使用方法和注意事项

最好按照github里的例子ctrl+c => v 模版、js mint-ui/example/pages/pull-up.vue 注意设置:mt-loadmore组件:auto-fill='autoFill'为false,以防止上来无限请求     :给mt-loadmore父组件css:overflow: scroll;防止华为手机和苹果模式下浏览器手机测试上拉无效     :给mt-loadmore父组件css:-webkit-overflow-scrolling: touch;防止苹果手机拖动生涩     :给mt-loadmore父组件高度:style="{ height: wrapperHe...

0
0
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
暂无内容
5 评论
83 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部