TypeError：无法添加属性 x，对象不可扩展答案

【问题标题】：TypeError: Cannot add property x, object is not extensibleTypeError：无法添加属性 x，对象不可扩展
【发布时间】：2018-08-12 17:11:29
【问题描述】：

我在使用 MobX 操作切换布尔可观察对象时遇到问题。该消息似乎表明我正在尝试添加一个属性，而我只是试图将其从 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>

谁能说出导致问题的原因？

【问题讨论】：

您如何将change_copy_message_state() 转化为行动？也可能需要在超时内调用runInAction() 并在其中设置值
这是我正在使用的装饰函数：decorate(UiStore, { text_copied_message : observable, change_copy_message_state : action });
Mobx 中的权限和操作要么被装饰，要么调用 mobx action()
我的错误，上面的评论已被编辑
尝试使用runInAction，因为超时是异步的

标签： reactjs mobx mobx-react

【解决方案1】：

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

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

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

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

【讨论】：