相关疑难解决方法(0)

我正在使用Vuetify预定义的模板'Google Contacts'.

链接:https://vuetifyjs.com/en/examples/layouts/googleContacts

我是Vuetify的新手,在理解某些代码时面临困难.一个是'插槽激活器'.

示例代码:

<v-list-tile slot="activator">
    <v-list-tile-content>
        <v-list-tile-title>
            {{ item.text }}
        </v-list-tile-title>
    </v-list-tile-content>
</v-list-tile>

谁能告诉我'槽激活器'是如何工作的？

我似乎无法让 Vuetify v-menu 的示例代码在我的 PWA 应用程序中工作，但它在 Fiddle 中正常工作（例如https://jsfiddle.net/tjw13yz4/27/）

问题是：激活器插槽内容没有出现。

通过调试 vuetify 源代码，我发现激活器模板出现在“默认”槽（所有隐藏内容所在的位置）下，而不是在命名的激活器槽（可见按钮/点击区域应该所在的位置）中。

我已将我的应用程序简化为基本框架（最初我有动态组件、表单、API 等），因此我将其简化为顶级 v-app 元素内的一个 v-menu，并删除了所有路由器，商店和其他插件。这很简单，我可以得到它，但仍然不起作用。小提琴和我的本地应用程序之间唯一的区别是构建系统。

我还尝试更改/删除插槽道具和on通过按钮的绑定，这确实修改了命名插槽在 Vuetify（或 Vue）中的内部表示方式。然而，无论有没有道具的版本都不能正确绑定命名槽。

我还更新并重建了 npm（在另一个 SO 中建议），所以我使用的是最新的 Vue 2.6.10 和 Vuetify 1.5.14。

我还确保我正在包装<v-app></v-app>（但在我安装 Vuetify 插件时发生了这种情况），如其他 SO 中所述。

我还阅读了这篇 SO，我发现它在调试中很有用。

我试过slot=activator直接放在 HTML 标签上，而不是使用模板。

而且我可能尝试了很多其他的东西，（最初我只是遇到了一个on没有定义 for v-on的问题，但这是由于这个潜在的问题）。

这些是我的简化文件 - 这一切都非常标准：

App.vue（有/没有用于事件绑定的道具）

<template>
  <v-app>

    <v-menu offset-y>
      <template v-slot:activator>
        <v-btn color="primary" dark>Dropdown</v-btn>
      </template>

      <p>The menu content</p>
    </v-menu>

    <v-menu offset-y>
      <template v-slot:activator="{ on }">
        <v-btn color="primary" …