原文:Vue點擊切換Class變化,實現Active當前樣式

剛自學Vue不久,所以還不太熟,所以直接上代碼。 一 先在data里增加一個變量,用來儲存當前點擊的元素 二 在Template里面的代碼,切記在 click方法里面要傳index, 三 點擊事件:改變data里面activeClass的值 四 在style中寫上 .active 樣式 ...

2019-01-15 20:14 0 5785 推薦指數:

查看詳情

vue 點擊切換動態Class變化,實現當前樣式改變

一、先在data里增加一個變量,用來儲存當前點擊的元素 return { leftColorDisplay: 0, // 0為默認選擇第一個,-1為不選擇 }; 二、在template里面的代碼,切記在@click方法里面要傳index, 三、點擊事件:改變 ...

Thu Jul 16 01:12:00 CST 2020 0 6129
vue 實現active點擊圖片切換

循環條件下: 1.點擊函數@click="active(index)" 獲取點擊的位置 2.講索引值傳給class,點擊哪一個則顯示哪一個的樣式 3.在data添加ins的初始值 4.使用三目運算符切換圖片 三木運算符執行方法:如果index ...

Tue Oct 15 02:24:00 CST 2019 0 3018
Vue實現active點擊切換樣式

1.html 2.在循環的代碼那里添加 3.添加樣式 4.初始化數據 5.調用方法 當我們觸發點擊事件的時候,傳入循環的index ,這樣我們就可以將綁定房東樣式賦給點擊到的x ...

Tue Jul 02 03:57:00 CST 2019 0 3927
Vue實現active點擊切換

Vue實現active點擊切換 循環的情況: 1、點擊時傳入index索引(獲取當前點擊的是哪個) @click=“active(index)” 2、將索引值傳入class(索引等於幾就第幾個添加active類) :class="{active:index==ins ...

Wed Jul 10 19:05:00 CST 2019 0 3391
vue2.0 實現click點擊當前li,動態切換class

1,文件內容 ----//為item添加不存在的屬性,需要使用vue提供的Vue.set( object, key, value )方法。 看詳解:https://cn.vuejs.org/v2/api/#Vue-set <template>  < ...

Mon Jun 19 22:54:00 CST 2017 3 36395
vue2.0 實現click點擊當前li,動態切換class

1,文件內容 ----//為item添加不存在的屬性,需要使用vue提供的Vue.set( object, key, value )方法。 看詳解:https://cn.vuejs.org/v2/api/#Vue-set <template>  <div> ...

Fri Jan 20 01:27:00 CST 2017 11 5184
VUE 動態切換列表active樣式

參考VUE官方文檔樣式綁定 https://cn.vuejs.org/v2/guide/class-and-style.html 需求是動態加載出來了所有菜單列表,點擊其中一個li元素改變這個元素的背景色 用到VUE樣式綁定對象語法 如果 isActive 的布爾值為 true ...

Sat Dec 29 02:45:00 CST 2018 0 4074
vue 點擊切換class

v-bind:class="index== num? activeClass : ''"index是循環數組的索引,num是點擊獲取的索引。 ...

Tue Jul 02 23:10:00 CST 2019 0 1343
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM