v-data-table中的列插槽不渲染用户定义的<tr>标签

Vuetify v3.1.5中，可以使用slot-scope属性来定义插槽内容。要渲染<tr>标签，需要在列插槽中添加一个包含<tr>标签的模板。代码示例如下：

<template> <v-data-table :headers="headers" :items="desserts" item-key="name"> <template v-for="column in headers" v-slot:[item.${column.value}]="{ item }"> <template v-if="column.value === 'name'"> <tr> <td>{{ item.name }}</td> </tr> </template> <template v-else> <td>{{ item[column.value] }}</td> </template> </template> </v-data-table> </template>

在上面的代码中，我们使用v-for指令遍历headers中的所有列，并使用slot-scope属性将item作为参数传递给插槽。对于每列，我们使用v-if指令来判断是否为“name”列，并渲染<tr>标签。对于其他列，我们只需渲染<td>标签即可。

这些修改将确保列插槽中的<tr>标签与用户定义的内容一起正确渲染。