一、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的詳解整合，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！