小编fin*_*dev的帖子

vuetify 2.0 v-data-tables 的文档没有指定如何通过 v-slot:body 控制扩展项。我有一个表，我需要用 body v-slot 指定，并想使用扩展功能。

预期行为是通过单击表中一列中的按钮，该行在下方展开。

我正在使用 v-slot:body ，因为我需要完全自定义列内容。我正在从 vuetify 1.5 迁移代码，其中 props.expanded 启用了此功能。

代码笔：https ://codepen.io/thokkane/pen/PooemJP

<template>
  <v-data-table
    :headers="headers"
    :items="deserts"
    :expanded.sync="expanded"
    :single-expand="singleExpand"
    item-key="name"
    hide-default-footer
  >
    <template v-slot:body="{ items }">
      <tbody>
        <tr v-for="item in items" :key="item.name">
          <td>
            <v-btn @click="expanded.includes(item.name) ? expanded = [] : expanded.push(item.name)">Expand</v-btn>
          </td>
        </tr>
      </tbody>
    </template>
    <template v-slot:expanded-item="{ headers, item }">
      <span>item.name</span>
    </template>
  </v-data-table>
</template>

<script>
  export default {
    data () {
      return {
        expanded: [],
        singleExpand: false,
        headers: [
          { text: 'Dessert …

如何将vuetify嵌套列表默认设置为关闭？文档示例显示了嵌套列表功能，但是在添加到应用程序时默认情况下嵌套列表是打开的。 https://vuetifyjs.com/zh-CN/components/navigation-drawers#example-nested