前端之tableData

<template>
    <div>
        <el-table
                :data="tableData"
                style="width: 100%;margin-bottom: 20px;"
                row-key="id"
                border
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
        >
            <el-table-column prop="name" label="名称" sortable width="180"></el-table-column>
        </el-table>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                tableData: [
                    {
                        children: [
                            {
                                name: "菜单管理",
                                id: "060ac069ea5b1b1b90e200d94f7941a2"
                            },
                            {
                                name: "字典管理",
                                id: "68aa1ca036ef8e6d606651f258321f88"
                            },
                            {
                                children: [
                                    {
                                        name: "删除",
                                        id: "0e64c997bcec402b7a840fc18e7e4e82"
                                    },
                                    {
                                        name: "查询",
                                        id: "52ae959c875c6fc521ba4ea546ee88ed"
                                    },
                                    {
                                        name: "添加",
                                        id: "59c86152b4e0b345636eb3a48d9ad263"
                                    },
                                    {
                                        name: "导出",
                                        id: "66d8a79be81d61d4e75feccfe2aee94e"
                                    },
                                    {
                                        name: "更新",
                                        id: "acc80082612d67847940985dfe53268b"
                                    },
                                    {
                                        name: "导入",
                                        id: "e5668f14d71db22cb2ad063c87f0b6d3"
                                    }
                                ],
                                name: "角色管理",
                                id: "951581fdede1c585a5b7f2de16eddfe2"
                            },
                            {
                                name: "组织机构",
                                id: "3504711eedb26cab2b9eb2f8c3433aa7"
                            },
                            {
                                name: "用户管理",
                                id: "6221da7dac0e80af56d18f9355003438"
                            }
                        ],
                        name: "系统设置",
                        id: "0b423292e0e27485cdd5257be6701a9f"
                    }
                ]
            };
        },
    };
</script>