Я использую компонент Data Tree из PrimeReact, документы приведены ниже. Компонент дерева принимает объект с полями, определенными как
const data = [
{
"key": "0",
"label": "Documents",
"data": "Documents Folder",
"icon": "pi pi-fw pi-inbox",
"children": [{
"key": "0-0",
"label": "Work",
"data": "Work Folder",
"icon": "pi pi-fw pi-cog",
"children": [{ "key": "0-0-0", "label": "Expenses.doc", "icon": "pi pi-fw pi-file", "data": "Expenses Document" }, { "key": "0-0-1", "label": "Resume.doc", "icon": "pi pi-fw pi-file", "data": "Resume Document" }]
},
{
"key": "0-1",
"label": "Home",
"data": "Home Folder",
"icon": "pi pi-fw pi-home",
"children": [{ "key": "0-1-0", "label": "Invoices.txt", "icon": "pi pi-fw pi-file", "data": "Invoices for this month" }]
}]
}
]
, названными так
<Tree value={data} />
Атрибут icon определяет символ, отображаемый рядом с тегом label. Я хочу использовать свой собственный .png вместо доступных значков. Сначала я бы попытался добавить тег img, но это не сработало. Если вам нужна дополнительная информация, пожалуйста, дайте мне знать.
https://www.primefaces.org/primereact/#/tree