element-ui tree樹怎么加載后臺數(shù)據(jù)？

element 是下面這種的數(shù)據(jù)格式，但是后臺給返回的所以數(shù)據(jù)是的對象格式層級嵌套，這個要怎么樣循環(huán)進去？

export default {

data() {
  return {
    data: [{
      label: '一級 1',
      children: [{
        label: '二級 1-1',
        children: [{
          label: '三級 1-1-1'
        }]
      }]
    }, {
      label: '一級 2',
      children: [{
        label: '二級 2-1',
        children: [{
          label: '三級 2-1-1'
        }]
      }, {
        label: '二級 2-2',
        children: [{
          label: '三級 2-2-1'
        }]
      }]
    }, {
      label: '一級 3',
      children: [{
        label: '二級 3-1',
        children: [{
          label: '三級 3-1-1'
        }]
      }, {
        label: '二級 3-2',
        children: [{
          label: '三級 3-2-1'
        }]
      }]
    }],
    defaultProps: {
      children: 'children',
      label: 'label'
    }
  };
 }
};

回答

編輯回答

故人嘆

你可以跟你的后臺要求給你一個樹狀結(jié)構(gòu)的數(shù)據(jù)，我最近也用到這個，但是我們沒有樹狀結(jié)構(gòu)的數(shù)據(jù)，都是一條一條的數(shù)據(jù)，每一條里面有父級id和它本身的id，用遞歸把父級id等于id的數(shù)據(jù)塞到他的child下面，就是在前臺我們自己組合出樹狀數(shù)據(jù)傳給tree組件。你的問題描述不是很清晰，能否根據(jù)你的業(yè)務(wù)再詳細(xì)描述一下。

2017年7月15日 07:56

編輯回答

奧特蛋

你理解錯了，后臺給的東西不需要你循環(huán)，這個數(shù)組你也不需要你定義內(nèi)容，讓后端基本上按這個格式返回就可以了，給你看看我返回的

{
    "status": 1,
    "message": "獲取成功",
    "data": [{
        "id": 4,
        "parent_id": 0,
        "url": "content",
        "name": "內(nèi)容",
        "icon": "el-icon-menu",
        "sort": 100,
        "created_at": "2018-07-05 12:06:27",
        "updated_at": "2018-07-05 14:37:04",
        "deleted_at": null,
        "_child": [{
            "id": 5,
            "parent_id": 4,
            "url": "articles",
            "name": "內(nèi)容管理",
            "icon": null,
            "sort": 100,
            "created_at": "2018-07-05 12:07:29",
            "updated_at": "2018-07-05 14:24:55",
            "deleted_at": null,
            "is_last": true
        }, {
            "id": 6,
            "parent_id": 4,
            "url": "category",
            "name": "類別管理",
            "icon": null,
            "sort": 100,
            "created_at": "2018-07-05 14:24:06",
            "updated_at": "2018-07-05 14:25:46",
            "deleted_at": null,
            "is_last": true
        }, {
            "id": 7,
            "parent_id": 4,
            "url": "article_edit",
            "name": "編輯內(nèi)容",
            "icon": null,
            "sort": 100,
            "created_at": "2018-07-05 14:26:43",
            "updated_at": "2018-07-05 14:26:43",
            "deleted_at": null,
            "is_last": true
        }],
        "is_last": false
    }, {
        "id": 8,
        "parent_id": 0,
        "url": "system",
        "name": "系統(tǒng)",
        "icon": "el-icon-menu",
        "sort": 100,
        "created_at": "2018-07-05 14:28:09",
        "updated_at": "2018-07-05 14:37:34",
        "deleted_at": null,
        "_child": [{
            "id": 10,
            "parent_id": 8,
            "url": "config",
            "name": "配置管理",
            "icon": null,
            "sort": 99,
            "created_at": "2018-07-05 17:02:22",
            "updated_at": "2018-07-05 17:02:22",
            "deleted_at": null,
            "is_last": true
        }, {
            "id": 9,
            "parent_id": 8,
            "url": "menu",
            "name": "菜單管理",
            "icon": null,
            "sort": 100,
            "created_at": "2018-07-05 14:28:24",
            "updated_at": "2018-07-05 14:28:24",
            "deleted_at": null,
            "is_last": true
        }],
        "is_last": false
    }]
}

2017年5月28日 13:15