Javascript 更改对象属性时触发组件重新渲染

当观察对象的属性更改时，是否可能以某种方式触发组件重新渲染？我知道，如果我替换对象，组件将重新渲染，但当我仅更改其属性时，它不会重新渲染

class SomeComponent extends LitElement {

      static get properties() {
        return {
          obj: { type: Object, reflect: true }
        }
      }

      constructor() {
        super();
        this.obj = {
           value: 'value' 
        };

      }

      handleClick(value) {
        this.obj.value = value;
      }

      render() {
        return html `
          <div>
            <p>My Value: ${this.obj.value}</p>

            <button @click="${() => this.handleClick('new value')}">Button</button>
          </div>
        `;
      }

    }

 customElements.define('some-component', SomeComponent);

类SomeComponent扩展了LitElement{
静态获取属性（）{
返回{
对象：{type:Object，reflect:true}
}
}
构造函数（）{
超级（）；
this.obj={
价值：“价值”
};
}
handleClick（值）{
this.obj.value=值；
}
render（）{
返回html`
我的值：${this.obj.Value}

按钮
`;
}
}
自定义元素。定义（'some-component'，SomeComponent）；

---

尝试使用

this.requestUpdate（）

并成功，但我不确定这样的解决方案是否优化了我认为在更改obj.value后立即放置requestUpdate方法是个好主意

我经常使用这个.requestUpdate（），它通常会触发我想要的更改

您还可以查看this.updated方法并按如下方式实现它：

updated(changedProperties: PropertyValues): void {
    if (changedProperties.has('obj') triggerMethod()
  }

但这应该能帮到你：

 handleClick(value) {
    this.obj.value = value;
    this.requestUpdate()
  }

对于您来说，使用该方法绝对是针对web标准优化的：）