小编lon*_*kel的帖子

我有个问题。我将 Vuetify 安装到我现有的 Laravel 应用程序中（当然我之前安装过 Vue）。我的朋友开始用 vuetify 创建模板。然后我们在控制台中发现了一个错误。

错误是：

'app' 已被删除，请改用 ''。

该应用程序运行正常，但出现此错误。我认为这是因为我们错误地使用了该应用程序。我试图通过几种方式将 Vue 组件包含到刀片模板中，但都不是很好。我试着用<v-app>，<app>在刀片，删除<v-app>从App.vue和混合不同的方式抿着嘴。

这是我的 app.js 的一部分：

const app = new Vue({  
   el:'#app',
   router,
   store,
   vuetify,
   render:h => h(App)
});

这是 App.vue

<template>
  <v-app>
    <v-content>
      <router-view></router-view>
    </v-content>
  </v-app>
</template>

这是我包含 vue 组件的刀片模板。

@extends('setup')
  @section('app')
     <div id="app">
        <App></App>
     </div>
  @endsection

如何在我的刀片中包含 App 组件？

您好，我正在尝试扩展默认的 v-data-table 组件以Vuetify避免代码冗余。我的组件很少v-data-table。它的工作原理相同，但表头可能不同。我正在使用v-slots，但如何扩展动态插槽Vuetify？

当我必须将自定义 html 添加到表中的一列（例如action）时，我正在使用：

<v-data-table
   :headers="questionTableHeaders"
   :items="questions.fetchedData"
   class="elevation-1"
   hide-default-footer
   :page.sync="questions.pagination.page"
   :items-per-page="questions.pagination.itemsPerPage"
   :loading="loadingData"
   loading-text="Loading..."
   no-data-text="No data.">

   <template v-slot:item.action="{ item }">
      <v-icon
      small
      class="mr-2"
      title="title"
      @click="clickOnTheItem(item)">
      fas fa-plus
      </v-icon>
   </template>

</v-data-table>

但有时表没有列操作。如何在组件dataTable扩展默认v-data-table组件中准备动态插槽，以确保传递到组件的每个标头都有一个可以在父组件中使用的插槽？

如果我有标题：

[
   {text: "text1", value: "name"},
   {text: "text2", value: "hash"}
]

我可以访问老虎机item.name并且item.hash？

<dataTable :url="examApiUrl" :headers="examTableHeaders">
   <template v-slot:item.name="{ item }"></template>
   <template v-slot:item.hash="{ item }"></template>
</dataTable>

但正如我之前所写，标题可以不同。如何在组件中准备插槽dataTable？