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

2024-03-11

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>.


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

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

文档link https://v2.vuejs.org/v2/api/#v-bind.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vue.js 如何设置 :id 前缀字符串? 的相关文章

随机推荐

  • 如何从命令行覆盖 protractor.conf.js 值?

    我目前有量角器设置可以在我们的集成服务器上运行 在 protractor conf js 文件中我有以下内容 multiCapabilities browserName firefox platform MAC browserName ch
  • 检查函数是否返回 true 以执行另一个函数

    我用 JS 编写了一个表单验证 以 return true 结尾 function check validation code return true 我想要的是 需要检查 check 函数是否返回 true 我想执行另一个函数 我尝试过的
  • 如何在 Jinja2 上解压多个变量

    我正在尝试在 jinja 模板引擎上解压多个变量 我怎样才能实现这个目标 我正在努力实现这样的目标 for item1 item2 item3 in items div class row div class four columns im
  • 如何检测文本区域的任何更改?

    我目前已将我的文本区域绑定到几个似乎有效的事件 然而 问题是事件重叠并触发多次 这反过来又使性能降低了太多 我想要做的几乎是捕获文本区域的任何更改 单击 粘贴 keyup keydown 右键单击上下文菜单编辑 右键单击 剪切 删除 粘贴
  • Telegram bot API:我可以混合使用自定义键盘和force_reply吗?

    我有一个自定义键盘 但要处理答案 我需要强制回复 以便我在下一条消息中收到问题 我已经这样做了 var opts reply markup JSON stringify keyboard OK Cancel one time keyboar
  • 导入错误:没有名为 pynotify 的模块。安装模块时

    所以这个错误不断出现 每次我尝试运行该脚本时 它都会返回 Traceback most recent call last File cli py line 11 in
  • Firebase 中现有的快照类型有什么区别?

    随着我在 Flutter 中的代码和编码经验的进一步发展 我在使用 Firebase API 时遇到过不同类型的快照 我说的是 AsyncSnapshots QuerySnapshots DocumentSnapshots 和 DataSn
  • 如何过滤指定时间段内的 Facebook 潜在客户

    我正在使用 Facebook API v4 获取潜在客户列表 使用 PHP 和库中内置的 get 方法 我想知道如何将日期范围传递到请求中以仅获取 2 个日期之间的潜在客户 我首先使用以下命令获取 adets 列表 request fb g
  • 生成类型类实例时无法证明单例类型是单例类型

    假设我有一个类型类 它证明 Shapeless 联积中的所有类型都是单例类型 import shapeless trait AllSingletons A C lt Coproduct def values List A object Al
  • ng-repeat 中的 Angular UI 工具提示未关闭

    请看下面的 plunker http plnkr co edit RPpjULZsSDnTFPKiafl2 http plnkr co edit RPpjULZsSDnTFPKiafl2 基本上 当向上 向下移动到 ng disabled
  • Windows:如何获取相机支持的分辨率?

    因此 为了获取相机列表并让用户选择一个 C Boost dshow Windows 我使用这样的代码 include StdAfx h include list h include
  • 将 1 通道图像转换为 3 通道图像

    我正在尝试在 OpenCV 2 3 1 中将 1 通道图像 16 位 转换为 3 通道图像 我在使用合并功能时遇到问题并收到以下错误 Mat temp tmp2 Mat hud tmp2 cv ptr gt image tmp2 conve
  • 使用decode() 与正则表达式来转义该字符串

    我有以下字符串 我正在尝试找出转义它的最佳实践 该解决方案必须有点灵活 因为我从 API 接收此输入 并且我不能绝对确定当前的字符结构 n相对于 r 将永远是相同的 If it ain t broke don t fix it nWent
  • 创建实用程序类?

    我对 OOP 非常陌生 并且正在尽最大努力使事情严格基于类 同时使用良好的编码原则 我现在已经进入我的项目了 我有很多通用方法想要放入实用程序类中 有没有创建实用程序类的最佳方法 public class Utilities int tes
  • 删除不是 .isin('X') 的行[重复]

    这个问题在这里已经有答案了 抱歉 刚刚进入 Pandas 这似乎应该是一个非常直接的问题 我怎样才能使用isin X 删除行are in列表X 在 R 中我会写 which a in b 你有很多选择 整理一下上面的一些答案和接受这篇文章的
  • S3(亚马逊简单存储系统)存储价格是如何计算的?

    我不太确定这是否是解决这个问题的正确堆栈交换站点 但我发现没有更适合的站点 我计划在下一个项目中使用 S3 但我不确定存储的价格实际上是如何计费的 如果我只是使用 S3 来放入千兆字节的数据并且几乎从不删除数据 那么我不会有任何问题 但事实
  • iOS 中的 Facebook 发帖错误

    在这里 我尝试使用以下代码向 Facebook 添加帖子 FBAppCall appCall FBDialogs presentShareDialogWithLink urlToShare name Title caption nil de
  • VSTS + 八达通部署?为什么我看到很多 CI/CD 设置都同时使用?

    我是一名正在转向 DevOps 的开发人员 通过观察 我注意到许多开发商店已经开始使用 Octopus Deploy 和 Azure Devops Services AzDo 以前称为 VSTS 或者他们正在启动新项目来设置 devops
  • scanf() 在操作系统中如何工作?

    我一直想知道 scanf printf 在硬件和操作系统级别实际上是如何工作的 数据在哪里流动以及操作系统在这些时间里到底在做什么 操作系统进行哪些调用 等等 scanf 和 printf 是 libc C 标准库 中的函数 它们分别调用
  • Vue.js 如何设置 :id 前缀字符串?

    class tab title v on click tab v for tabTitle index in tabTitleList id index 我在 vue 社区中找到了这个示例 但在我的情况下 我希望我的 id 有一个前缀 而不