不在PrimeVue中工作的vue3数据表组件

Question

我正在为我的网站使用可加脂的PrimeVue，但是即使我已经安装了所有的需求，我什么也没有出现。只有一个警告：

Failed to resolve component: data-table
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 

在main.js中

import PrimeVue from 'primevue/config'
import Column from 'primevue/column'
import Dialog from 'primevue/dialog'
import DataTable from 'primevue/datatable'
appInstance.use(PrimeVue)
appInstance.component('Column', Column)
appInstance.component('Dialog', Dialog)
appInstance.component('Datatable', DataTable)

在userTable.vue中：

<data-table :value="products">
     <Column field="brand" header="Brand"></Column>
     <Column field="year" header="Year"></Column>
     <Column field="color" header="Color"></Column>
     <Column field="vin" header="Vin"></Column>
</data-table>

以及data()中的产品示例：

products: [
        {"brand": "Volkswagen", "year": 2012, "color": "Orange", "vin": "dsad231ff"},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345"},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr"},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh"},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34"},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj"},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr"},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34"},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5"},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s"}
      ],

这是我正在研究的第3节，所以如果有人知道原因和解决办法，我会很高兴的：

Answer 1

您输入标签错误，我建议您更改如下：

appInstance.component('Datatable', DataTable)

通过

appInstance.component('DataTable', DataTable)

在组件中

<DataTable :value="products">
     <Column field="brand" header="Brand"></Column>
     <Column field="year" header="Year"></Column>
     <Column field="color" header="Color"></Column>
     <Column field="vin" header="Vin"></Column>
</DataTable>