技術標籤：vue方法修改data的值

相信大家都需要過，在Vue中使用Elementui的時候，遇到最多也最蛋疼的問題就是修改預設樣式，接下來直奔主題；

//  template    :text-inside="true"    :stroke-    :percentage="70" >-progress>

預設樣式

方法1

1、找預設新增的類名

2、去掉scoped，scoped是Vue是限制獨立元件中的CSS樣式不被溢位到全域性使用！

//  style.el-progress-bar__inner{  background: #000 ;}//  這兩種酌情使用。.el-progress-bar__inner{  background: #000 !important;}//!important是css選擇器中的屬性，預設權重無線大！
 

總結：這種方法會生效，但是會影響到全域性；

方法2，

使用Vue中的深度作用域選擇器！這個符號哦 >>>

<style  scoped>>>> .el-progress-bar__inner{  background: #000 ;}style>

總結：使用Vue的深度選擇器，就可以完美的解決！

注意：有些像 Sass 之類的前處理器無法正確解析>>>。這種情況下你可以使用/deep/或::v-deep操作符取而代之——兩者都是>>>的別名，同樣可以正常工作。

給大家附上官網地址：https://vue-loader.vuejs.org/zh/guide/scoped-css.html#混用本地和全域性樣式

如果大家喜歡的話，歡迎關注“前端偽大叔”我將為您不間斷的分享前端學習知識！