TypeError: Cannot read properties of null (reading 'name')
 

всем привет
помогите пожайлуста
я получаю данные с собственного сервера вот
{
"hydra-member": [
{
"id": 1,
"name": "Категория - 1",
"categories": [
{
"id": 2,
"name": "Категория - 2",
"categories": null
},
{
"id": 3,
"name": "Категория - 3",
"categories": [
{
"id": 4,
"name": "Категория - 4",
"categories": null
}
]
},
{
"id": 5,
"name": "Категория - 5",
"categories": null
},
{
"id": 6,
"name": "Категория - 6",
"categories": null
}
]
},
{
"id": 7,
"name": "Категория - 7",
"categories": [
{
"id": 8,
"name": "Категория - 8",
"categories": null
}
]
},
{
"id": 9,
"name": "Категория - 9",
"categories": null
}
]
}
это сервер и
вот сам код

const usersUrl = 'http://localhost:3001/hydra-member'

const sendRequest = (url) => {
return fetch(url)
.then(response => {
return response.json()
})
}

sendRequest('GET', usersUrl)
.then(data => {
const cards = data.map((item) => {

return (`
<div class="userBlock">
<div>
<h3>${item.name}</h3>
<div>${item.categories.name}
</div>

</div>
</div>
`)
})
cards.forEach(element => {
let users = document.querySelector('.users');
users.innerHTML = users.innerHTML + element;
});
})
.catch(err => console.error(err))

вот этом месте у меня ошибка <div>${item.categories.name}</div>
TypeError: Cannot read properties of null (reading 'name')

Erhan,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

1. У вас у последнего члена массива categories = null и вы пытаетесь прочитать у null свойство name.
2. Как можно догадаться из названия свойства categories, оно содержит не одну категорию, а список их, т.е. массив категорий. У массива нет свойства name, поэтому у вас вместо categories.name будет underfined.