无法访问对象内的 JSON 数据。属性

Question

我目前正在从事 LitElement 项目。我使用此代码将 JSON 数据添加到 category.items 属性中，

fetchItems(category) {   
    if (!category || category.items) {
      return;
    }

    this.getResource({
      url: 'data/' + category.name + '.json',
      onLoad(e) {
        category.items= JSON.parse(e.target.responseText);
      },

    });
}

 getResource(rq) {
    let xhr = new XMLHttpRequest();
    xhr.addEventListener('load', rq.onLoad.bind(this));
    xhr.open('GET', rq.url);
    xhr.send();
  }
}

然后我试图在另一个组件中获取这些数据，但是我无法访问项目属性。

我用来获取数据的代码，

handleCategoriesyChanged(e) {
    this.categories = e.detail.categories.value; 
    if(this.location!=undefined){
        for(let i=0; i<this.categories.length ;i++){
            if(this.location.params[0]==this.categories[i].name){
                this.item = this.categories[i];
            }
        }
        console.log(this.item);
        console.log(this.item.items);
        console.log(JSON.stringify(this.item, null ,2));
        console.log(this.item.items);
    }

这是 console.log 在 chrome 中的输出。

当我调用对象时它显示项目属性，但我无法访问它。所以，我尝试使用 JSON.stringify 方法，但那次不显示项目 property.I 在这个网站上经历了类似的问题，但我无法确定出了什么问题以及为什么在这种情况下会发生这种情况.

Answer 1

看起来您正在改变 this.item 并在日志后的某处添加字段 items。这就是为什么 JSON.stringify.

中没有键 items 的原因

console.log(this.item); 记录对 this.items 的引用，当您通过引用更改对象时，输出将更改。

尝试执行此代码并展开第一个 console.log 输出以了解我在说什么。

var object = {};
console.log(object);
console.log(object.a);
object.a = 'first key';
console.log(object);

无法访问对象内的 JSON 数据。属性

Can not acess the JSON data inside the object. property

javascript

json

object

console.log

lit-element

无法访问对象内的 JSON 数据。 属性

Can not acess the JSON data inside the object. property

javascript

json

object

console.log

lit-element

无法访问对象内的 JSON 数据。属性