Question

我试图将v-for循环的值设置为for循环内标签的ID值。

 <table class="APPPPTable" style="width:100%;font-size:11px;">
    <thead>
      <tr>
        <th v-for="heading in tableInfo.columns" class="text-center">
            <span id="heading.field" v-html="heading.label"></span>
        </th>
      </tr>
     </thead>
 </table>

“ heading.field”具有价值。但是每次我看到开发人员工具时，它都会将id的id值显示为id =“ heading.field”而不是“ heading.field”值。

Answer 1

id的范围不是动态绑定的，必须使用v-bind:或:的ID才能以您想要的方式使用它：

看例子：

<table class="APPPPTable" style="width:100%;font-size:11px;">
    <thead>
      <tr>
        <th v-for="heading in tableInfo.columns" class="text-center">
            <span :id="heading.field" v-html="heading.label"></span>
        </th>
      </tr>
     </thead>
 </table>

Answer 2

<span id="heading.field">-> <span v-bind:id="heading.field">

 <table class="APPPPTable" style="width:100%;font-size:11px;">
    <thead>
      <tr>
        <th v-for="heading in tableInfo.columns" class="text-center">
            <span v-bind:id="heading.field" v-html="heading.label"></span>
        </th>
      </tr>
     </thead>
 </table>

Answer 3

您可以尝试:id="heading.field"

无法在<th v-for =“”标签内的<span>标签设置ID值

3 个答案: