<template>
        <el-table :data="tableData" style="width: 100%">
        <template v-for="item,index in tablelist" :key="index">
                 <el-table-column prop="{{ item.name }}" :label="item.lable" />
        </template>
    </el-table>
</template>
<script setup lang="ts">
import { reactive,ref } from 'vue'

    const tableData=reactive([
        {   
            data:'2020-08-08',
            time:'申报时间',
            state :'待提交',
            projectname:'某公司大数据建设',
            projectmain:'某公司主体描述',
            ProjectSinkingCompany:'某子公司',
            start:'2020-09-01',
            finish:'2021-08-01',
            totalinvestment:'1000万元',
            ProjectAuthority:'发改',
            grade:'国家级',
            DepartmentInCharge:'科室一',
        }
    ])
    const tablelist=reactive([
        {lable:'复选框',name:''},
        {lable:'序号',name:''},
        {lable:'申报时间',name:'data'},
        {lable:'状态',name:'state'},
        {lable:'项目名称',name:'projectname'},
        {lable:'项目主体',name:'projectmain'},
        {lable:'项目下沉公司',name:'ProjectSinkingCompany'},
        {lable:'拟开工时间',name:'start'},
        {lable:'拟竣工时间',name:'finish'},
        {lable:'总投资',name:'totalinvestment'},
        {lable:'项目主管部门',name:'ProjectAuthority'},
        {lable:'级别',name:'grade'},
        {lable:'主管科室',name:'DepartmentInCharge'}])
    const operate=reactive([true,true,true,true]) 
</script>
<style  scoped>

</style>表格数据不显示是为什么
<p>根据提供的代码,表格数据不显示可能是因为注释掉了 <code>tableData</code> 的定义。需要将注释取消掉或者重新定义 <code>tableData</code>,并且确保 <code>tableData</code> 中的属性名与 <code>tablelist</code> 中的 <code>name</code> 对应。另外,<code>el-table-column</code> 中的 <code>prop</code> 属性应该绑定到 <code>item.name</code>,而不是字符串 '“{{ item.name }}”'。</p>
Element UI 表格数据不显示问题排查:示例代码分析

原文地址: https://www.cveoy.top/t/topic/mNZV 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录