代码之家 › 专栏 › 技术社区 › ekjcfn3902039

Vuetify/Vue3插槽在模板之间隐藏

vuetify.js vuejs3 vue.js

ekjcfn3902039 · 技术社区 · 1 年前

我正在寻找在子模板中显示父模板中的对象的正确方法。但是,在以下情况下,对象都具有相同的名称,并且父模板中的对象被遮挡。有没有一种简单的方法可以重命名一个值,或者我必须做一些更复杂的事情才能在子模板中显示这两个值?

<v-data-table :items="someParentItems" ...>
 <template v-slot:expanded-row="{ columns, item }">
   PARENT {{ item }}
   <v-data-table :items="someChildItems" ...>
     <template #item.someField="{ item }">
       CHILD {{ item }} <!-- Would really like CHILD {{ parentItem }} {{ childItem }} -->
     </template>
   </v-data-table>
 </template>
</v-data-table>

1 回复 | 直到 1 年前

Moritz Ringler 1 年前

这只是简单的对象析构函数,您可以在冒号后设置新名称:

<v-data-table :items="someParentItems" ...>
 <template v-slot:expanded-row="{ columns, item: parentItem }">
   PARENT {{ parentItem }}
   <v-data-table :items="someChildItems" ...>
     <template #item.someField="{ item: childItem }">
        CHILD {{ parentItem }} {{ childItem }}
     </template>
   </v-data-table>
 </template>
</v-data-table>

推荐文章

StuP · 响应式Vue组件在数据更改时不更新

2 年前

mrDandaleonx · Vue3获取div内容并将其发布到表单

2 年前

ateymour · Vue3在异步调用后将道具传递给子组件

2 年前

Hebert Lima · 使用Dev容器在网络(LAN)上运行vue应用程序

2 年前

Artur Müller Romanov · 是否可以有条件地渲染布局?

2 年前

Stove Games Games · dist内的图像文件夹未添加到Heroku网站

2 年前

Serkan Gün · 如何在vuejs3中设置与本地存储类似的结构

2 年前

devAR · 单击其他组件时,单选按钮未保持选中状态

2 年前

Coderama · 在v-for指令中使用:key属性时,TS应出现类型错误

2 年前

lnamba · Vue。js在mounted中运行代码,然后再次运行代码以实现重启功能

7 年前