鍍金池/ 問答/HTML/ vue中怎么給一個div動態(tài)添加class

vue中怎么給一個div動態(tài)添加class

我要的效果是點擊一個div，這個div是循環(huán)出來的，點擊那個讓哪一個加邊框，再點擊他的話邊框消失，這個應該怎么做

回答
編輯回答
久舊酒

初始化isActive變量為false，點擊時候切換，自動切換div類名active是否擁有

<div v-bind:class="{ active: isActive }" @click="!isActive"></div>
2018年1月26日 13:52
編輯回答
荒城

第一個答案是對的！思路就是需要一個flag，點擊事件去改變這個flag的值，而這個flag再去改變那個class的有無

2018年7月15日 12:40
編輯回答
司令
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://cdn.bootcss.com/vue/2.4.4/vue.min.js"></script>
</head>
<body>
<div id="app">
    <ul id="omain">
        <li v-for="(item,index) in data">
            <div @click="showIndex = index" :class="{'divborder':showIndex == index}"> show {{ item }}</div>
        </li>
    </ul>
</div>
<script>
    var app = new Vue({
        el: '#app',
        data(){
            return {
                data: ['aa', 'bb', 'cc'],
                showIndex: 0
            }
        }

    })
</script>
<style>
    .divborder {
        border: 1px solid #ddd;
    }
</style>
</body>
2017年9月24日 10:40
編輯回答
殘淚
<div  @click="changeClass"></div>

changeClass(){
    $(window.event.target).toggleClass("className");
}
2018年5月23日 17:27