排查了很多,就是找不到,一直报错
[Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.
代码如下:
App.vue
<template>
<div id="app">
<DataTable></DataTable>
</div>
</template>
<script setup>
import DataTable from "./components/DataTable.vue";
export default {
name:'App',
components:{
// DataTable,
'DataTable':DataTable
}
}
</script>
main.js
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import App from './App.vue'
Vue.use(ElementUI)
new Vue({
el: '#app',
render:h => h(App)
})
<template>
<div>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="日期" width="180"></el-table-column>
<el-table-column prop="name" label="姓名" width="180"></el-table-column>
<el-table-column prop="address" label="地址"></el-table-column>
</el-table>
</div>
</template>
<script>
export default {
data(){
return{
// 定义数据
tableData:[{
date: '2023-11-02',
name: '张三',
address: '重庆市涪陵区'
},{
date: '2023-11-03',
name: '李四',
address: '西安市雁塔区'
},{
date: '2023-11-04',
name: '王五',
address: '西安市未央区'
},{
date: '2023-11-05',
name: '赵六',
address: '西安市灞桥区'
}
]
}
}
}
</script>