Vue引用Swiper4插件無(wú)法重寫分頁(yè)器樣式的解決方法
最近在嘗試用nuxtjs來(lái)搭建新的站點(diǎn)，但是平時(shí)在jquery里面用慣的一些插件一到vue上面引用就各種不順暢~本文記錄一下在用Swiper插件來(lái)做輪播圖的時(shí)候遇到的問(wèn)題~至于怎么在vue里面引用插件就不累贅了，npm能告訴你~
Swiper的分頁(yè)器是靠mounted()掛載到Vue組件上而不是直接寫在template里，所以在style scoped中寫的樣式無(wú)法作用到分頁(yè)器的點(diǎn)上。解決辦法是把重寫的樣式寫在scoped之外。(以下截圖不完整，僅用做說(shuō)明)
template：
script:
<style scoped></style>里面寫不受影響的樣式(template里面有的類名)
在<style scoped></style>下面新建一個(gè)<style></style>，在<style></style>里面寫分頁(yè)器分頁(yè)點(diǎn)的樣式
重寫之后的樣子：
以上這篇Vue引用Swiper4插件無(wú)法重寫分頁(yè)器樣式的解決方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
javascript中Set、Map、WeakSet、WeakMap區(qū)別
這篇文章主要介紹了javascript中Set、Map、WeakSet、WeakMap區(qū)別,需要的朋友可以參考下2022-12-12
關(guān)于vant的日歷組件,在iPhonex上可選日期空白
這篇文章主要介紹了關(guān)于vant的日歷組件,在iPhonex上可選日期空白，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
淺談使用Vue完成移動(dòng)端apk項(xiàng)目
這幾天，我做了一個(gè)vue移動(dòng)端的小項(xiàng)目，本文主要介紹了Vue移動(dòng)端apk項(xiàng)目，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-06-06
這篇文章主要介紹了Vue Ajax跨域請(qǐng)求實(shí)例詳解,需要的朋友可以參考下2017-06-06
vue-cli3使用postcss-plugin-px2rem方式
這篇文章主要介紹了vue-cli3使用postcss-plugin-px2rem方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-07-07
vue?使用addRoutes動(dòng)態(tài)添加路由及刷新頁(yè)面跳轉(zhuǎn)404路由的問(wèn)題解決方案
我自己使用addRoutes動(dòng)態(tài)添加的路由頁(yè)面,使用router-link標(biāo)簽可以跳轉(zhuǎn),但是一刷新就會(huì)自動(dòng)跳轉(zhuǎn)到我定義的通配符?*?指向的404路由頁(yè)面,這說(shuō)明沒有找到指定路由才跳到404路由的,這樣的情況如何處理呢,下面小編給大家分享解決方案,一起看看吧2023-10-10
vue 使用v-if切換輸入框時(shí)導(dǎo)致輸入框的數(shù)據(jù)內(nèi)容沒有清空的問(wèn)題解決(兩種解決方法)
這篇文章主要介紹了vue 使用v-if切換輸入框時(shí)導(dǎo)致輸入框的數(shù)據(jù)內(nèi)容沒有清空的問(wèn)題解決，本文給大家分享兩種解決方法,需要的朋友可以參考下2023-05-05
使用vue2.0創(chuàng)建的項(xiàng)目的步驟方法
這篇文章主要介紹了使用vue2.0創(chuàng)建的項(xiàng)目的步驟方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
vue實(shí)現(xiàn)ajax滾動(dòng)下拉加載，同時(shí)具有l(wèi)oading效果(推薦)
這篇文章主要介紹了vue實(shí)現(xiàn)ajax滾動(dòng)下拉加載，同時(shí)具有l(wèi)oading效果的實(shí)現(xiàn)代碼，文章包括難點(diǎn)說(shuō)明，介紹的非常詳細(xì)，感興趣的朋友參考下2017-01-01
組件是Vue.js最強(qiáng)大的功能之一,組件可以擴(kuò)展HTML元素,封裝可重用的代碼,下面這篇文章主要給大家介紹了關(guān)于vue如何動(dòng)態(tài)加載組件的相關(guān)資料,需要的朋友可以參考下2022-10-10