出現環境：在vue元件中使用了scoped，發現手寫的標籤樣式起作用，但是第三方的元件標籤並沒有起作用
原因：1. 先搞清楚scoped的布局實現
在style上加上scoped後 會對 style裡面加了樣式的標籤 每個加上乙個 像這樣的乙個屬性
data-v-4686dc05
元件內的樣式只會對帶有這個標籤的dom元素生效，因此加上scoped後，元件內的樣式不會影響元件外。
官方文件
2. scoped 只會作用於自元件的根元件
官方解釋：使用scoped後，父元件的樣式將不會滲透到子元件中。不過乙個子元件的根節點會同時受其父元件的 scoped css 和子元件的 scoped css 的影響
解決方案：
1. 加上乙個不帶scoped的style
2. 使用 >>> 深度訪問 注意：只針對css起作用 一些sass less預處理器不起作用
3. 使用 /deep/ 或者 ::v-deep 推薦使用 ::v-deep可以直接使用
// 我在使用/deep/時會報錯 查了一下 需要修改webpack ，vue-loader
elementUI rule驗證無效 不起作用
因為專案中遇到複雜的form表單傳輸 具體最終提交格式如下 表單 forminfo 物流資訊 deliveryinfo 開票資訊相關 invoiceflag invoiceinfo 發現所有表單驗證不起作用了 以ordertype為例 頁面 js rules prop和rules裡的校驗名稱是一樣的...
vue 單檔案 scoped 樣式簡析
scoped是乙個極其常用的如上面所說，加上了scoped後，渲染時這個元件所有元素都會加上data v xx這樣的屬性。vue 使用者應該經常會在除錯的時候見到類似這樣的結構 然後在 style 也會加上對應的屬性選擇器 money data v 9bfd234a 這樣結果就很明確了，加了 sco...
Vue 元件間的樣式處理 scoped
關於 vue 元件間的樣式問題，一直困擾我。父與子，子與父，兄弟元件間相互的樣式汙染，再加上 scoped 作用域的作用，導致我們很難搞清楚之間的相互關係，今天我們就來一 竟 父元件 子元件 通過現象可以看到，父元件的樣式覆蓋了子元件的樣式 但是為什麼會這樣呢？按照我的理解，每個 vue 元件都有自...