2017-02-20 4 views
2

안녕하세요 저는 예를 들어내 배열 객체의 데이터를 jstree에 어떻게 가져올 수 있습니까? 난 내 jstree 내 배열 객체의 데이터를 얻을 수있는 방법

.. 궁금 내가 가진이 배열 객체

(이 내 보관함에 폴더를 나열하는 내 콘솔의 반응이다)

0:Object 
     .tag:"folder" 
     id:"id:dEOW7ElDHUgAAAAAAAAABw" 
     name:"Yahoo! Mail" 
     path_display:"/Yahoo! Mail" 
     path_lower:"/yahoo! mail" 
    1:Object 
     .tag:"folder" 
     id:"id:dEOW7ElDHUgAAAAAAAAAJg" 
     name:"Sample Folder" 
     path_display:"/Sample Folder" 
     path_lower:"/sample folder" 

    2:Object 
     .tag:"folder" 
     id:"id:dEOW7ElDHUgAAAAAAAAAJw" 
     name:"Sample Folder 1" 
     path_display:"/Sample Folder 1" 
     path_lower:"/sample folder 1" 
나는이 코드를 시도했지만 내가 그것을 콘솔하려 같이 아무 폴더가 없습니다 및 응답 당신은 단지 jstree 표준 다음 데이터를 매핑 할 필요가 상단

  $("#people").jstree({ 
         // generating tree from json data 
         "json_data" : { 
          "data" : [{ 
            "data": response.entries, 

           }] 

         }, 
         // plugins used for this tree 
         "plugins" : [ "json_data", "ui", "types" ] 
        }) 
+0

를 시도? Dropbox HTTP API'list_folder'는 JSON을 반환합니다. 따라서 https://www.jstree.com/docs/json/에서 설명한대로 jstree 호환 형식으로 API 응답을 매핑하면됩니다. –

+0

내 코드를 편집했습니다. 응답은 dropbox의 응답 api에서입니다. – VLR

답변

1

에서 3 개체입니다. 이것은 주어진 데이터를 기반으로 기본 예입니다 : 당신은 무엇을

var response = { 
 
    "entries": [{ 
 
    "tag": "folder", 
 
    "id": "id:dEOW7ElDHUgAAAAAAAAABw", 
 
    "name": "Yahoo! Mail", 
 
    "path_display": "/Yahoo! Mail", 
 
    "path_lower": "/yahoo! mail" 
 
    }, { 
 
    "tag": "folder", 
 
    "id": "id:dEOW7ElDHUgAAAAAAAAAJg", 
 
    "name": "Sample Folder", 
 
    "path_display": "/Sample Folder", 
 
    "path_lower": "/sample folder" 
 
    }, { 
 
    "tag": "folder", 
 
    "id": "id:dEOW7ElDHUgAAAAAAAAAJw", 
 
    "name": "Sample Folder 1", 
 
    "path_display": "/Sample Folder 1", 
 
    "path_lower": "/sample folder 1" 
 
    }] 
 
} 
 

 
// map data to jstree standard 
 
response.entries.forEach(function(entry) { 
 
\t if (entry.tag == 'folder') { 
 
    \t entry.parent = '#' 
 
    } 
 
    entry.text = entry.name 
 
}) 
 

 
$('#jstree').jstree({ 
 
    'core': { 
 
    'data': response.entries 
 
    } 
 
});
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script> 
 

 
<div id="jstree"></div>