vue.js - 用vue，如何给一个列表中的每个元素标签绑定id

问题描述

问 题

现在我想写三个span标签，并且每个标签上都要绑定上一个id。结构现在是这样的：

<span class="tab-title" v-on:click="tab" v-for="(tabTitle,index1) in tabTitleList">{{ tabTitle.title }}</span>

JS如下：

var app3=new Vue({
    el:'#app3',
    data:{
        tabTitleList:[
            {title:'Tab1'},
            {title:'Tab2'},
            {title:'Tab3'}
        ]
    }
});

如果我想绑ID的话，应该怎么写呢？

解决方案

如果只是用索引来做id的话，可以这样做

class="tab-title" 
v-on:click="tab" 
v-for="(tabTitle,index) in tabTitleList"
:id="index"

如果id在 tabTitleList 里的话，可以这样做

class="tab-title" 
v-on:click="tab" 
v-for="(tabTitle,index) in tabTitleList"
:id="tabTitle.id"

这篇关于vue.js - 用vue，如何给一个列表中的每个元素标签绑定id的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！