reactjs - 一旦我更新了 mobx 5，KonvaJs 示例就不起作用

Question

我正在尝试在该 KonvaJs 示例上进行开发：https ://konvajs.org/docs/sandbox/Window_Frame_Designer.html

克隆存储库时，一切正常。但是，一旦我将 mobx 从 4.3.1 更新到 5.15.0，它就会出现该错误；

错误：MobX 注射器：商店“商店”不可用！确保它是由某个 Provider 提供的

有人可以帮我解决这个问题。谢谢。

Answer 1

看起来mobx-react正在使用 React Contexts 传递store给组件。

但是 React Context 不会自动为自定义反应渲染器工作（例如react-konva）。有关更多信息，请参阅：https ://github.com/konvajs/react-konva/issues/188

作为解决方法，您只需要在<Stage>组件内“桥接”存储：

        <Stage
          width={this.state.width}
          height={height}
          ref={ref => {
            this.stageRef = ref;
          }}
          onClick={this.handleClick}
        >
          <Provider store={this.props.store}>
            <Layer scaleX={scale} scaleY={scale} y={20} x={20}>
              <Section
                section={root.sections[0]}
                x={root.frameSize}
                y={root.frameSize}
              />
              <Sash
                width={root.width}
                height={root.height}
                size={root.frameSize}
              />
              <Metrics />
            </Layer>
          </Provider>
        </Stage>

演示：https ://codesandbox.io/s/frame-editor-update-t7nxw