How to style a row in a table based on its contents?

[wpq]

I have a table made of rows such as

{
  "name": "hello",
  "type": "important"
},
{
  "name": "world",
  "type": "info"
},

I would like to style the row depending on the value of type - is that possible?

[s.molinari]

You can use the body slot and do whatever you want with it.

https://quasar.dev/vue-components/table#Example--Body-slot

Scott

[wpq]

Thank you - I saw the body slot example but thought there could be something else on the whole row level.

If I understand it correctly, I need to build the whole row manually? (that is giving all the fields one by one). Is it complementary to the column definition, or an overload of that definition?

[s.molinari]

Good question. I’m not sure. You’ll have to play with it.

Scott

[qyloxe]

@wpq

QTable API - scoped slots:

overloading slots:

• body
• body-cell

complementary slots:

• body-cell-[name]

Maybe this will help to build a better mental model of q-table. BUT bear in mind, that in the context of row, the body-cell-[name] are complementary, but in the context of cells they’are of course overloading. Nevertheless, the data model of q-table is: “collection of rows”, so I am used to think about them as I wrote above.