NuxtUI / Utable component : question about nested data and slot customization
I'm trying to create a Utable with data fetched from an api, but its return object is a json with nested data that i need to display on the table, for example
In the Utable tag i put a template to access the row of the score data, the idea is to change the color of the badge from the score, but nothing happen as the image below
My guess is its comes from the nested data because i was able to do the same thing with the first column "vin" that has not the nested data.
I hope it is pretty clear, thanks in advance !
![No description](https://cdn.answeroverflow.com/1230452476378087464/Capture_decran_2024-04-18_a_11.35.02.png)
3 Replies
Hi ! Actually the key property is only able to reach the first level of the object. You can use it like this instead:
I'm not sure my code will exactly suit your needs, but if you can show what a row looks like I could help further
Okay, thanks for the answer but the problem in this case is that the "score" key is in a nested object like this
`
In fact, i managed to the score in the table, but the slot use to customize it with a badge is not working
But with this code, the template slot is not working as expected, first image is with nested declaration on the template, second is with no badge
![No description](https://cdn.answeroverflow.com/1230505605085794405/Capture_decran_2024-04-18_a_15.02.30.png)
![No description](https://cdn.answeroverflow.com/1230505605358161971/Capture_decran_2024-04-18_a_15.08.08.png)
There is no "status" in your data, but this should work