vue awesome swiper分頁器的問題

2021-10-11 14:28:40 字數 1890 閱讀 6750

這幾天在做乙個vue的專案 其中有用到vue-awesome-swiper的,在照著文件寫了後發現分頁器就是顯示不出來,在網上查了好多方法有說是版本問題還有說是樣式什麼的。

我這裡用到的是 「vue-awesome-swiper」: "^3.1.3"版本的

:options

="swiperoptiond"

style

="padding-bottom

: 40px;

">

class

="swiper-slide"

v-for

="(item,index) in lablelist "

:key

="index"

style

="display

: flex;

justify-content

: space-between;

">

v-for

="(iitem,iindex) in item "

:key

="iindex"

@click

="active(iindex,iitem.id)"

:class=""

style

="width

: 20%;

">

src=

"../../static/image/home_menu1.png"

alt="

" v-if

="iitem.mediumurl==null||iitem.mediumurl=='

'||iitem.mediumurl==undefined"

>

:src

="iitem.mediumurl"

alt="

" v-if

="iitem.mediumurl!=null&&iitem.mediumurl!='

'&&iitem.mediumurl!=undefined"

>

>

}p>

div>

swiper-slide

>

class

="swiper-pagination"

slot

="pagination"

>

div>

swiper

>

swiperoptiond: ,

// observer:true,

// observeparents:true,

},

在main.js中就是:

import vueswiper from 'vue-awesome-swiper'

import 'swiper/dist/css/swiper.css'

vue.use(vueswiper)

我這樣的方式我看是文件中最普遍的寫法,我這裡用不到自動切換什麼的就只是顯示乙個分頁器並且能跟著滑動變化就行了,但就是不知道之前也是這樣寫的為什麼就是不顯示,然後瞎搗鼓 搗鼓出來了

再有就是在另乙個頁面中有用到手動切換slide的時候觸發事件,我的事件剛開始是寫在data中的然後切換slide的時候就是滑動事件監聽不生效

後來在網上找到了解決方法:

swiperoption: {},

我把它寫在了created()裡面 但是網上也有說是寫在mounted()中,我寫在created()中是可以生效的

created() ,

on:

if(this.activeindex==1)

},},}}

這些東西我寫在這裡也就是為了記錄一下,雖然解釋的不清楚吧但是如果要是能幫到你也是極好的

element ui前端分頁 與後端分頁的問題

前端分頁 一次性請求所有資料 然後前端對資料進行擷取展示 後端分頁 需要我們把頁碼 請求條數傳送給後端 後端根據條件每次返回對應的條數 data tabledatas.slice currentpage 1 pagesize,currentpage pagesize style width 100 ...

關於CRicheditctrl分頁列印問題

研究了好久,終於解決了,可以支援cricheditctrl列印。void printrich zeromemory di,sizeof di di.cbsize sizeof docinfo di.lpszdocname t test di.lpszoutput t c users desktop ...

Oracle中的order by分頁排序問題

今天在系統測試的過程中,測試人員發現自己新新增的科目新增到系統中在頁面預設分頁查詢中沒有找到自己新加的科目 分頁過程中頁面顯示資料確實和資料表中的資料總量一致 但是通過系統的搜尋功能是可以查詢的到資料?提了乙個bug?解決bug的過程 系統中有乙個科目表subject manage表結構如下 cre...