vue中使用/deep/失效的解決方法
更新時(shí)間：2022年11月22日 14:28:38 作者：懟懟你
這篇文章主要介紹了vue中使用/deep/失效的解決辦法,使用了css預(yù)處理器，則可以使用/deep/， 如果/deep/ 無(wú)效，則使用 ::v-deep，本文給大家講解的非常詳細(xì)需要的朋友可以參考下
1. 若是沒(méi)有使用像less, sass等這樣的css預(yù)處理器， 那么是只能使用 >>>這樣的css深度選擇器
<style scoped>
.box >>> el.dialog {
}
</style>2. 若是使用了css預(yù)處理器，則可以使用/deep/， 如果/deep/ 無(wú)效，則使用 ::v-deep
<style scoped lang="scss">
.box /deep/ el.dialog {
}
</style>或
<style scoped lang="scss">
.box ::v-deep el.dialog {
}
</style>3. 如果使用了css預(yù)處理器，使用/deep/ 和::v-deep 都失效，那么需要看看style 上是不是沒(méi)有加上 scoped。若加上了還是無(wú)效，那么就只能把代碼寫(xiě)入全局css中了，但是需要注意用一個(gè)css類(lèi)包裹起來(lái)，不然會(huì)改變很多全局樣式。
<style>
.box .el-dialog {
}
</style>或
<style lang="scss">
.box .el-dialog {
}
</style>到此這篇關(guān)于vue中使用/deep/失效的解決辦法的文章就介紹到這了,更多相關(guān)vue /deep/無(wú)效內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:
相關(guān)文章
Vue.js綁定HTML class數(shù)組語(yǔ)法錯(cuò)誤的原因分析
Vue.js綁定HTML class數(shù)組語(yǔ)法錯(cuò)誤有哪些原因?qū)е碌哪?，該如何解決呢？下面小編給大家分享Vue.js綁定HTML class數(shù)組語(yǔ)法錯(cuò)誤的原因分析，感興趣的朋友一起看看吧2016-10-10
vue項(xiàng)目如何去掉URL中#符號(hào)的方法
在開(kāi)發(fā)過(guò)程中發(fā)現(xiàn)路徑中帶有/#/的標(biāo)示,而且還去不掉,很丑陋,下面這篇文章主要給大家介紹了vue項(xiàng)目如何去掉URL中#符號(hào)的相關(guān)資料,文中通過(guò)實(shí)例代碼的非常詳細(xì),需要的朋友可以參考下2022-07-07
前端Vue3引入高德地圖并展示行駛軌跡動(dòng)畫(huà)的步驟
最近在Vue項(xiàng)目中引入高德地圖,實(shí)現(xiàn)地圖展示與交互的方法和技術(shù),這里跟大家分享下,這篇文章主要給大家介紹了關(guān)于前端Vue3引入高德地圖并展示行駛軌跡動(dòng)畫(huà)的相關(guān)資料,需要的朋友可以參考下2024-09-09
這篇文章主要為大家詳細(xì)介紹了Vue組件實(shí)現(xiàn)觸底判斷，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-06-06
vue實(shí)現(xiàn)動(dòng)態(tài)綁定行內(nèi)樣式style的backgroundImage
這篇文章主要介紹了vue實(shí)現(xiàn)動(dòng)態(tài)綁定行內(nèi)樣式style的backgroundImage方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-07-07
基于vue cli重構(gòu)多頁(yè)面腳手架過(guò)程詳解
本文分步驟給大家介紹了基于vue cli重構(gòu)多頁(yè)面腳手架過(guò)程，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下2018-01-01
vue/cli3.0腳手架部署到nginx時(shí)頁(yè)面空白的問(wèn)題及解決
這篇文章主要介紹了vue/cli3.0腳手架部署到nginx時(shí)頁(yè)面空白的問(wèn)題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
Vue3配置axios跨域?qū)崿F(xiàn)過(guò)程解析
這篇文章主要介紹了Vue3配置axios跨域?qū)崿F(xiàn)過(guò)程解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-11-11
在這篇文章中，大家會(huì)了解到如何在 Vue 組件中使用防抖和節(jié)流控制 觀察者（watchers）以及事件處理程序，文中的示例代碼簡(jiǎn)潔易懂，希望對(duì)大家有所幫助2023-03-03
vue-cli中實(shí)現(xiàn)響應(yīng)式布局的方法
這篇文章主要介紹了vue-cli中實(shí)現(xiàn)響應(yīng)式布局的方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03