MobX 将 JSX 对象转换为代理对象

如何解决MobX 将 JSX 对象转换为代理对象

我将一个 JSX 对象存储在我的 ActiveComponent 存储中。

ActiveComponent 商店：

export default class ActiveComponent {
    activeComp = <></>;

    constructor() {
        makeAutoObservable(this);
    }

    setActiveComp(n) {
        // N should be a react component.
        this.activeComp = n;
    }
}

在 App.js 中，我通过上下文获取 Store 实例，并尝试呈现其值。

function App() {
    return (
        <ActiveCompContext.Consumer>
            {function(value) {
                console.log("Value:");
                console.log(value.activeComp);
                return (value.activeComp);
            }}
        </ActiveCompContext.Consumer>
    )
}

控制台日志：

错误：

Uncaught TypeError: Cannot call a class as a function

解决方法

我已经解决了！

我使用过这样的数组：

ActiveComponentStore.activeComp = [
  Start,null,];

我已经将它作为参数传递给 React.createElement：

return React.createElement.apply(null,value.activeComp);

感谢@Tholle 的贡献。