自己搜了点,又进行了改进
html部分
<div v-for="(item, index) in data" :key="index">
<div @click="isShow">
<h5>{{item.name}}</h5>
</div>
</div>
js部分
isShow(event) {
let _el = event.currentTarget
if (_el.getAttribute('class') === 'active') {
_el.setAttribute('class', '')
} else {
_el.setAttribute('class', 'active')
}
}
css部分
.active{
display:none;
}
以上内容是网上微改,点击之后隐藏div
以下是改造可以设置同级节点的显示隐藏
html部分
<div v-for="(item, index) in data" :key="index">
<div @click="isShow(index)">
<h5 res="chenbushui">{{item.name}}</h5>
</div>
</div>
js部分
isShow(index) {
let _el = this.$refs.chenbushui[index]
if (_el.getAttribute('class') === 'active') {
_el.setAttribute('class', '')
} else {
_el.setAttribute('class', 'active')
}
}
css部分
.active{
display:none;
}