在使用MobX加载应用后添加对象属性时，使其可观察

如何解决在使用MobX加载应用后添加对象属性时，使其可观察

（使用CRA框架，因此代码将不会使用装饰器样式）

我们有一个将用户配置文件状态存储在mobX商店中的应用程序，我已经对此示例进行了简化：

class UserStore {
constructor() {
    extendobservable(this,{
        userData: this.initiateUser(),setUser: action(user => {
            this.userData = user;
        })
    }),initiateUser = () => ({
    firstName: '',lastName: '',profile: {
        date_format: ''
    }
    });
}

在应用程序加载时，我们命中了一个API端点，该端点返回客户端特定的对象属性，例如使用户拥有使用未知键的新属性（示例）：

preferences: { books: {},movies: {} }

如何将对象属性添加到MobX可观察的并使这些属性也可观察？

商店当前已加载到应用中，就像在主app.js中一样：

<Provider
   UserStore={UserStore}
>
   <Routes />
</Provider>