当前位置： 移动技术网 > IT编程>网页制作>CSS > 基于vue的前端框架的MintUI（更适用于移动端）安装教程

基于vue的前端框架的MintUI（更适用于移动端）安装教程

2019年06月04日  | 移动技术网IT编程  | 我要评论

早产儿喝什么奶粉,蔡佳明真实身份,金庸风尘劫

一、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官方文档：https://mint-ui.github.io/#!/zh-cn

通过以上的两个示例可以看到，使用mintui的用户交互界面要友好很多，在基于vue开发app的时候可以考虑使用这个前端ui框架。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网