mintUI 移動UI框架入門

2022-05-04 06:27:08 字數 2514 閱讀 3257

分為全域性引入和按需引入

全域性引入:

在man.js中引入

import mint from 'mint-ui'; 

import 'mint-ui/lib/style.css'

vue.use(mint);

按需引入:

import  from 'minu-ui';

vue.component(cell.name, cell);

vue.component(checklist.name, checklist);

引入完成。

然後就可以按照官網的例項進行操作了,自己簡單的做了乙個demo

<

template

>

<

div

class

="hello"

>

<

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

>

<

div

class

="page-swipe"

>

<

mt-swipe

:auto

="4000"

>

<

mt-swipe-item

:class

="">1

mt-swipe-item

>

<

mt-swipe-item

:class

="">2

mt-swipe-item

>

<

mt-swipe-item

:class

="">3

mt-swipe-item

>

mt-swipe

>

div>

<

mt-tabbar

v-model

="selected"

>

<

mt-tab-item

id="外賣"

>

<

img

slot

="icon"

src="../assets/logo.png"

>

外賣

mt-tab-item

>

<

mt-tab-item

id="訂單"

>

<

img

slot

="icon"

src="../assets/logo.png"

>

訂單

mt-tab-item

>

<

mt-tab-item

id="發現"

>

<

img

slot

="icon"

src="../assets/logo.png"

>

發現

mt-tab-item

>

<

mt-tab-item

id="我的"

>

<

img

slot

="icon"

src="../assets/logo.png"

>

我的

mt-tab-item

>

mt-tabbar

>

div>

template

>

<

script

>

export

default

}}script

>

<

style

scoped

>

.page-swipe .mint-swipe

.page-swipe .mint-swipe-item

.page-swipe .slide1

.page-swipe .slide2

.page-swipe .slide3

.page-swipe-desc

style

>

php CI框架入門

顯示2.控制器認識 controller是框架控制器資料夾 我們來寫一下自己的控制器,控制器檔名要和類名一直,類名首字母大寫 test.php檔案 defined basepath or exit no direct script access allowed class test extends ...

SSH框架入門

目前最新版本是spring framework 2.5.6 with dependencies.zip,該包不僅包含spring的開發包,而且包含spring編譯和執行所依賴的第三方類庫 aspectj 該路徑下包含了spring支援aspectj所需類的源 也包含了相關測試用例檔案 dist 該資...

Tigo框架入門

給大家介紹乙個go語言的web framework,tigo框架。tigo框架的設計風格有點類似於tornado,從python轉go的小夥伴可以看看。首先,安裝 go get github.com karldoenitz tigo 安裝結束後來編寫乙個簡單地hello world,如下 url路由...