Vuetify 3如何在展开面板中添加元素？原v-expansion-panel-content失效

Vuetify 3 中已经移除了 v-expansion-panel-content 组件，这就是你遇到“failed to resolve component: v-expansion-panel-content”错误的原因。在新版本里，展开面板的内容直接放在 <v-expansion-panel> 标签内部即可，无需额外的内容组件包裹。

对应你需求的嵌套展开面板实现代码如下：

<v-expansion-panel>
  <v-expansion-panel-header>父面板标题</v-expansion-panel-header>
  <!-- 父面板内容直接写在这里 -->
  <div>Lorem ipsum</div>
  
  <!-- 嵌套的子展开面板 -->
  <v-expansion-panels>
    <v-expansion-panel v-for="(item,i) in 2" :key="i">
      <v-expansion-panel-header> Item {{ i + 1 }}</v-expansion-panel-header>
      <!-- 子面板内容直接写在v-expansion-panel内部 -->
      <div>I'm nested ({{ i }})</div>
    </v-expansion-panel>
  </v-expansion-panels>
</v-expansion-panel>

关键变化说明： #

• 移除了旧版本的 v-expansion-panel-content 组件，所有面板内容直接作为 <v-expansion-panel> 的子元素存在
• 保留 <v-expansion-panels> 作为展开面板的容器，<v-expansion-panel-header> 用于定义面板头部区域

内容的提问来源于stack exchange，提问作者0xTanvir