vue點擊切換同級類名，點擊切換類名

同級切換類名

代碼：

<ul>
    <li v-for="(item,index) in items" :key="item.id" :class="{active:id==index}"
        @click="clickSwitch(index)">
        {{ item.title }}
    </li>
</ul>

js：

 data() {
        return {
            id: 0,
        };
    },
    methods: {
        clickSwitch(index) {
            this.id = index;
        },
   }

 

點擊添加刪除類名 

代碼：

<div :class="{'active':isCloned}" @click="togglePay">點擊切換樣式</div>

js：

 data() {
        return {
            isCloned: false,
        };
    },
    methods: {
        togglePay() {
            this.isCloned = !this.isCloned;
        }
    }