时间:2021-05-26
一、mintUI简介
mint是一个基于vue的前端UI框架,而它的样式比较类似于手机的样式,可以说是一个基于vue打包app的UI框架,使用mint框架可以给使用vue打包的app的用户更好的交互体验。mint已支持vue2.0。
二、安装和引入mintUI
在安装之前首先要对vue.js有所了解,有一个建立好的vue的项目以及安装好的node.js。
执行命令npm i mint-ui -S,出现以下界面代表安装成功。
引入muitUI:
在main.js中加入
import MintUI from 'mint-ui'import 'mint-ui/lib/style.css'Vue.use(MintUI)注意:样式需要单独引入。这样引入可以引入全部的组件
如果不想引入全部组件,只想按需引入,则需要安装
npm install babel-plugin-component -D
修改.babeirc为:
然后import需要的组件就可以了
三、使用示例
1、提示信息toast
html:
'
js:
在页面中的效果:
2、消息提示框
html:
js:
页面效果:
更多的示例和具体使用方法请看mintUI官方文档:http://mint-ui.github.io/#!/zh-cn
通过以上的两个示例可以看到,使用mintUI的用户交互界面要友好很多,在基于vue开发app的时候可以考虑使用这个前端UI框架。
以上所述是小编给大家介绍的vue前端框架—Mint UI的详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文为大家分享了vue.js中mint-ui框架的使用方法,具体内容如下1.安装vue2.0的mint-ui框架npminstallmint-ui-save2.
一、MintUI是由饿了么前端团队推出的一个基于Vue.js的移动端组件库,具有以下特性:使用文档:http://mint-ui.github.io/#!/zh
近期上手vue的移动端项目,舍弃了之前自己相对熟悉的mui框架,改为用饿了么团队为了vue量身定做的mint-ui框架。之前开发的时候觉得mui的文档就足够坑爹
今天来介绍一下ElementUI的使用,在Vue2.0更新之后,很多UI框架也应运而生,这个框架是饿了么团队开发的一款适用于PC的一个UI框架,体验之后给我的个
一个简单的移动端卡片滑动轮播组件,适用于Vue2.xc-swipe2.0全新归来。重写了全部的代码,更靠谱的质量,更优秀的性能EnglishDocument安装