类型错误：无法添加属性 x，对象不可扩展

Question

我在使用 MobX 操作切换布尔 observable 时遇到问题。该消息似乎表明当我只是尝试将其从 false 切换为 true 时，我正在尝试添加该属性：

TypeError: Cannot add property text_copied_message, object is not extensible
src/stores/ui_store.js:54
  51 | }
  52 | 
  53 | change_copy_message_state () {
> 54 |     this.text_copied_message = true;

这是操作：

change_copy_message_state () {
    this.text_copied_message = true;

    window.setTimeout(() => {
        this.text_copied_message = false;
    }, 5000);
}

这是调用操作的组件代码：

<CopyToClipboard text={ui_store.final_text_message}>
    <Button
        size='huge'
        color='orange'
        onClick={ ui_store.change_copy_message_state }
    >
        Copy Text and Open Social Media Sites in New Tabs
    </Button>
</CopyToClipboard>

谁能告诉是什么导致了这个问题？

Answer 1

我遇到了同样的问题，我通过将函数转换为箭头函数来解决，所以在你的情况下：

change_copy_message_state = () => {
    // ...
}

这种方式this绑定到对象。或者，在装饰它时，使用action.bound.

参考：https : //mobx.js.org/refguide/action.html