vue中的導航欄動態添加class(三目運算符)

1.三目運算符,:class=" isActive==‘aaa’ ? ‘isActive’ : ‘’ ",@click=“toggle(‘aaa’)”。判斷isActive是否等於aaa,相等 -> class=“isActive”,不等 -> class=’’,點擊的時候帶上實際的參數

在這裏插入圖片描述

2.script中的isActive默認爲“首頁輪播圖”,即“首頁輪播圖”的默認樣式爲black字體white背景

在這裏插入圖片描述

3.點擊導航欄,把參數賦值給isActive,該導航欄添加樣式

在這裏插入圖片描述

4.動態添加class=“isActive”

在這裏插入圖片描述

5.導航欄動態添加isActive的效果圖如下:

在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章