Vue how to concat dynamic id with field from v-for loop + string?

If you are generating a row by writing a template about each row. Then, I think this is the solution for you.

  <TradeTableItem
    v-for="(debtReserve, index) in debtReserves"
    :key="debtReserve.id"
    :debtReserve="debtReserve"
    :market="market"
    :id="'reserve' + index"
  ></TradeTableItem>

In the upper step, we generated an id for each row.

And, in TradeTableItem (your template where we are populating, the table rows), Write id as :id="this.id" where this.id is a part of props.

Hope this helps

You don't need to use the template {{prop}}, just use plain JavaScript string concatenation.

    <th v-for="(field, key) in lists[$route.params.model][$route.params.status].fields"
         :id="'order_by' + field"
         :key="key"
    >
                      
    </th>

Using JavaScript Expressions