vue element-ui tree 渲染问题

Question

问题描述

我要用element-ui渲染这样一个树结构，父文件下有字文件夹和单个的试题，子文件下有孙子文件夹和孙子试题

数据结构是这样的

{
    "catalogList": [
        {"name":"文件夹1"}，
        {"name":"文件夹2"}，
    ],
    "quizList": [ {"title":"试题1"} ],

根据elemtn-ui的文档，我可以把文件夹渲染出来，但是那个试题要怎么渲染出来呢？
如图，我希望试题能渲染在这里

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

        <el-tree
          :data="catalogList"
          :props="{
            label: 'Name'
          }"
          show-checkbox
          accordion
          node-key="id">
            <span class="custom-tree-node" slot-scope="{ node, data }">
              <span>{{ node.label }}</span>
            </span>
        </el-tree>

我用上面这个代码可以把文件夹成功渲染出来，但试题我就不知道该怎么去渲染了

Answer 1

你需要将试题和文件夹组装到children中，并列才能渲染出来。
不然的话 自己写一个树组件也不难。