为什么我的vuetify应用栏背景图片不显示？

Question

我试图加载一个svg作为应用程序栏的背景图片。但是它没有显示。虽然在应用栏中的图片组件可以工作，但一般在模板中使用图片时，作为src它不会显示在背景中。

 <v-app-bar :clipped-left="$vuetify.breakpoint.lgAndUp" app src="~assets/background.svg">
      <img src="~assets/background.svg" />
      <template v-slot:img="{ props }">
        <v-img v-bind="props"></v-img>
      </template>

      <v-app-bar-nav-icon @click.stop="drawer = !drawer" />
      <v-toolbar-title class="text-left hidden-sm-and-down">Database</v-toolbar-title>
    </v-app-bar>

结果是...

当做

 <v-app-bar :clipped-left="$vuetify.breakpoint.lgAndUp" app src="~assets/background.svg">
      <template v-slot:img="{ props }">
        <v-img v-bind="props"></v-img>
      </template>

      <v-app-bar-nav-icon @click.stop="drawer = !drawer" />
      <v-toolbar-title class="text-left hidden-sm-and-down">Database</v-toolbar-title>
    </v-app-bar>

结果只是一个空白的应用栏。

看来，这要么与应用栏背景的svg支持有关，要么与应用栏上的 nuxt资产管理 还是我对传递给模板元素的道具不了解......

我已经安装了@nuxtjssvg包，首先支持svg显示，并按照以下步骤使用 安装和使用说明但在这里却搞不清楚其他的问题。

任何支持或提示都非常感激。

Answer 1

就在我准备发这个帖子的时候，我最后搜索了一下我的问题，发现 发现了另一个问题，其中的语法略有不同。 和工作，当采用了对我的情况下工作。

他们的代码：

 <v-app-bar app>

            <v-btn v-if="$vuetify.breakpoint.smAndDown" @click="openDrawer = !openDrawer" text icon>
                <v-icon>mdi-view-headline</v-icon>
            </v-btn>
            <v-btn v-else :to="{name: 'home'}" text color="primary" class="ml-3" icon>
                <!-- Logo -->
                <img height="48"
                     :src="require('@/assets/logo.svg')"
                     alt="Manassa Logo"/>
            </v-btn>

            {{more stuff}}
        </v-app-bar>

-->

    <v-app-bar
      :clipped-left="$vuetify.breakpoint.lgAndUp"
      app
      dark
      :src="require('@/assets/images/app-bar-background.svg')"
    >