I am attempting to achieve the following:
<tr v-for="item in items" :key='item'>
<td v-for="field in fields" :key='field'>
{{ item[field.toLowerCase()] }}
</td>
</tr>
It seems that my field variable represents the key for each item element, but it returns values like Name or ID which I cannot use directly. Instead of using item[field.toLowerCase()], I would prefer a cleaner approach where I can simply use item[keyField], with keyField being a modified version of field.
Is there a way to achieve this in VueJS 3? I attempted the following:
<tr v-for="item in items" :key='item'>
<td v-for="field.toLowerCase() as keyField in fields" :key='field'>
{{ item[keyField] }}
</td>
</tr>
Unfortunately, it did not work.