这种具体的问题,其实更考察 js 的基本功吧,我自己简单的实现了一个:
<template>
<div id="app">
<ul>
<li class="item" @click="toggleActive">首页</li>
<li class="item" @click="toggleActive">视频</li>
<li class="item" @click="toggleActive">订阅</li>
</ul>
</div>
</template>
methods: {
toggleActive(e) {
let tabs = e.target.parentNode.children
Array.from(tabs).forEach((tab) => {
if(tab.classList.contains('active')){
tab.classList.remove('active')
}
})
e.target.classList.add('active')
}