点击某个li元素后出现或者消失该元素上一个蒙层,但是不知道怎么动态绑定类名,只绑定到该元素。现在是一点击所有元素都出现蒙层了。
目前是这样想的:
:class=”{show:isShow + index}(这个语法是错的,大概意思是想这样) 想把index绑定到变量上,然后再给他添加上class来显示,但是就像上面写的那样,这个语法实现不了
第二是给每个元素添加上 show1/show2/show3 的类名,但是这样就表示要写很多css: show1,show2,show3 {display:block},如果元素很多总不能一直加下去


···回复:

希望能帮到您

<li  v-for="node in nodes" :class={'active': node.actived} @click="clickNode(node)" :key="node.id">{{node.name}}</li>

data(){
    return {
        activedNode:null
    }
},
methods:{
    clickNode(node){
        this.activedNode && (this.activedNode.actived = undefined);
        node.actived = !node.actived;
        this.activedNode = node;
    }
}

···回复:

在获取数据后,循环为数组json的每一项添加属性,
例如 “seen”:”false”,
然后绑定到class里 三木运算
例如 <li :class=”list.seen?’masking’:”” @click=”showMasking(index)”></li>
然后利用参数index 来修改你所绑定的具体数据,改成true,就会添加类名,改回false就会移除类名


···回复:

循环的时候加一个判断,在你需要加类名的时候加上就行了。

例如:

<li v-for="(item,idx) in arr" :key="item.key" :class="idx === 1?'hello':'world'">
</li>

发表评论

电子邮件地址不会被公开。 必填项已用*标注

Scroll Up