for循环添加多个标签

vue v-for循环多个标签，点击标签变色，再点击取消，可以同时多选点击多个

她和海水一样咸

原创

关注

6点赞·2372人阅读

vue v-for循环多个标签，点击标签变色，再点击取消，可以同时多选点击多个

效果：

html：

<div class="relFacilityTitcon">

<i v-for="(item,index) in facilityList" :key="index" @click="changeSpan(index)" :class="{'bgcolor':spanIndex.indexOf(index)>-1}" >{{item}}</i>

</div>

复制

data：

data:{

spanIndex:[],

}

复制

vue：

methods: {

changeSpan(index){

let arrIndex = this.spanIndex.indexOf(index)

// console.log(arrIndex)

if(arrIndex>-1){

this.spanIndex.splice(arrIndex,1)

}else{

this.spanIndex.push(index)

}

},

function selectTag(showContent,selfObj){

var tag = document.getElementsByTagName("li")

var taglength = tag.length

for(var i=0i<taglengthi++){

tag[i].className = ""

}

selfObj.parentNode.className = "selectTag"

for(var i=0j=document.getElementById("tagContent"+i),i<taglengthi++){

j.style.display = "none"

}

document.getElementById(showContent).style.display = "block"

}

//]]>

</script>

这个 可以的！

var str=""

for(var i=0i<10i++)

{

str+="<a href='#'>"+i+"</a>"

}

$("#334").append(str)

---