Question

我有一个如下对象。现在，当我更改属性并调用requestRender时，它不会触发。据我所知，没有检测到属性更改。我该如何实现？

static get properties() {
  return {
    items: Object
    }
}

constructor() {
  super();
  this.items = {
    list: [{ a: 5, b: 6 },{ a: 5, b: 6 }]
  }
}

onClick() {
  this.items.list[1].a = 10; //change property
  requestRender(); //doesn't pick up the change...
}

Answer 1

lit-element要求您不变地管理属性，因此要更新该数据点，将需要执行以下操作：

onClick() {
  let list = this.items.list.slice();
  let item = Object.assign({}, list[1]);
  item.a = 10;
  list[1] = item;
  this.items = {
    list: list
  };
  // will update on it's own with out a render request
}

以上内容非常完整，但是ES5（ish）可以解决此问题。也可以使用更现代的JS来做到这一点，从而使其更易于管理。

onClick() {
  this.items.list[1].a = 10;
  this.items = {
    ...this.items
  };
  // will update on it's own with out a render request
}

希望有帮助。

聚合物3发光元素：requestRender未拾取数组对象更改

1 个答案: