未处理的拒绝（TypeError）：无法读取未定义的属性“子级”

Question

I am trying to fetch data from rest api using axios and i want to store data in an array and append new property children but i am getting error here is my code:

var categoriesTree = {};
axios.get('https://akkar.market/wp-json/wp/v2/job_listing_category?per_page=100')
.then(response => {
  categoriesTree = response.data
  categoriesTree.forEach(category => {
    if (category.parent === 0) {
      if (!(category.id in categoriesTree)) {
        categoriesTree[category.id] = {'name': category.name, 'children': []};
      } else {
        categoriesTree[category.id]['name'] = category.name;
      }
    } else {
      if (!category.parent in categoriesTree) {
        categoriesTree['parent'] = {'name': '', 'children': []};
      }
      categoriesTree['parent']['children'].push({'name': category.name, 'id': category.id});
    }
  })
})
console.log(categoriesTree)

i am getting this error:

Answer 1

It looks like there are a couple of problems:

1. In !category.parent in categoriesTree , you'd taking the logical NOT of category.parent (which will be true or false ) and using that result in the in operation. You need () around the in expression: !(category.parent in categoriesTree)

2. Even with the revision, that checks for a property whose name is the value of category.parent in categoriesTree . But then you create a property called parent , not a property with the name from category.parent .

If the property is supposed to be the value of category.parent , use that instead of 'parent' :

if (!(category.parent in categoriesTree)) {
    categoriesTree[category.parent] = {'name': '', 'children': []};
}
categoriesTree[category.parent]['children'].push({'name': category.name, 'id': category.id});

If it's supposed to be called parent (literally), then use that consistently instead:

if (!("parent" in categoriesTree)) {
    categoriesTree.parent = {'name': '', 'children': []};
}
categoriesTree.parent['children'].push({'name': category.name, 'id': category.id});

---

If categoriesTree will either not have a property called x or the property will have an object reference as a value, you can use if (!categoriesTree.x ) rather than if (!("x" in categoriesTree))`. Applying that to the two options above:

if (!categoriesTree[category.parent])) {
    categoriesTree[category.parent] = {'name': '', 'children': []};
}
categoriesTree[category.parent]['children'].push({'name': category.name, 'id': category.id});

If it's supposed to be called parent (literally), then use that consistently instead:

if (!categoriesTree.parent)) {
    categoriesTree.parent = {'name': '', 'children': []};
}
categoriesTree.parent['children'].push({'name': category.name, 'id': category.id});

Answer 2

I'm not sure, what you mean under if (!category.parent in categoriesTree) , but it looks like it always will return false . Try to change this condition simply to if (!categoriesTree.parent) , and I suppose it will work.