Vue.js 如何设置 :id 前缀字符串？

Question

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

我在 vue 社区中找到了这个例子，但在我的情况下，我希望我的“id”有一个前缀，而不仅仅是一个数字。

也就是说，如果索引为 1，我想要 <span id='sp_1'></span> 而不是 <span id='1'></span> 。

原文由 wtf512 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

你可以这样做，代码应该是不言自明的：

 <div v-for="(tabTitle, index) in tabTitleList">
    <span :id="'sp_' + index"> {{tabTitle}} </span>
</div>

文档 链接。

原文由 Saurabh 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

如果你有一个唯一的 id，做，你可以这样做：

 <ul>
    <li v-for="item in ritems" :id="['Row_' + item.id]">
        {{something}}
    </li>
</ul>

如果您没有唯一 ID，请执行此操作

<ul>
    <li v-for="(item , index) in ritems" :id="['Row_' + index]">
        {{something}}
    </li>
</ul>

在两者中，结果将是这样的：

 <ul>
    <li id="Row_12">
        something
    </li>
</ul>

原文由 Mohd Domais 发布，翻译遵循 CC BY-SA 4.0 许可协议