Question

我正在努力获得flummox和react-router一起工作的测试示例（免责声明：学习，为愚蠢的问题道歉）。

我在https://github.com/olegsmetanin/react_react-router_flummox_example找到了一些简洁的示例，但它使用了已弃用的React.withContext来启动应用（来自index.jsx）：

  React.withContext(
    { flux },
    () => React.render(<Handler />, document.getElementById(divid))
    );

Flummox现在有一个<FluxComponent/>可用于设置上下文，但我似乎无法使用react-router。

如果我这样做：

router.run((Handler, state) => {
    React.render(
            <FluxComponent flux={flux}>
                <Handler {...state}  />
            </FluxComponent>, 
            document.getElementById('app'));
});

我的处理程序似乎没有在其上下文中获得通量（并在控制台中抛出警告，因为它已丢失）。

感觉我在这里错过了一个重要的难题，但找不到具体的例子（我可以找到旧的flummox / react / react-router示例或新的flummox / react但不使用react-router ）。

有什么建议吗？

Answer 1

不要忘记在React组件的contextTypes中定义flux。您可以在构造函数中捕获上下文作为第二个参数。

export default class MyComponent extends React.Component {
    constructor (props, context) {
        super(props);
        this.AppStore = context.flux.getStore('appStore');
    }
}

MyComponent.contextTypes = {
  flux: React.PropTypes.object.isRequired
};

我last example的一些链接：

React.render

Component

Unit test of context

Flummox和react-router示例

1 个答案: