vue class的幾種使用方式

2021-10-07 20:04:54 字數 490 閱讀 5862

1.方法方式

其實,一開始我想實現動態拼接的效果(

:class="['icon-level' + item.oppgrade.tolowercase]"
)這樣子,但是不行。於是,我用了計算屬性,發現也不行,因為這個class需要引數支援,computed做不到。只能用方法了,而且用方法的時候,不能用把常量和方法寫一起,我試過了的,寫一起,常量的class會失效。方法實現方式如下:

1) html檔案:

2) .vue檔案:

methods:

}}3) .scss檔案:

$icons-icon-list:

icon-levela,

icon-levelb,

icon-levelc,

icon-levelf,

icon-levelh,

icon-leveln,

還沒寫完,後續補充。。。

CSS的幾種使用方式

樣式表有三種插入方式 一 外部樣式表 使用外部樣式表可以將同一樣式應用於多張網頁,通過這個方法你只需改動乙個檔案就能改變整個 的外觀。例 使用標籤讓每個頁面都連線到樣式表。標籤在head區域使用。注 檔案內容不應該包含任何的html標籤,字尾名應為.css。二 內嵌樣式表 內嵌樣式表應該在當有單獨文...

vue axios 使用的幾種方式

全域性註冊方法 this api.getlistapi test list then res 使用http.js getlistapi test list then res 封裝http檔案 將url字首封裝 var a request then function res axios原生請求 引入 ...

babel polyfill的幾種使用方式

preset與plugin的關係 例如,預設情況下babel可以將箭頭函式,class等語法轉換為es5相容的形式,但是卻不能轉換map,set,promise等新的全域性物件,這時候就需要使用polyfill去模擬這些新特性 優點缺點 配置完乙個轉換外掛程式後,中每個使用這個api的地方的 都會被...