1

我将 react-router 用于服务器和客户端路由，以尝试制作同构应用程序。服务器路由工作正常，我可以正常检索数据，但是，在客户端上，我单击的第一个链接会调用 react-router 在 url 更改时的回调。由于某种原因，后续点击不会触发回调。

//server.js
ReactRouter.run(mainApp.getComponent(), req.path, function (Root, state) {
//if no matching routes found, then go to 404
if (state.routes.length === 0) {
  res.status(404);
}

var RootComponent = fluxibleAddons.provideContext(Root, {
  getStore : React.PropTypes.func.isRequired,
  executeAction : React.PropTypes.func.isRequired
});

var loadAction = state.routes[1].handler.loadAction;
var renderReactOnServer = function () {
    var markup = React.renderToString(React.createElement(RootComponent, React.__spread({}, state, { context : context.getComponentContext()  }) ));
    res.expose(mainApp.dehydrate(context), mainApp.uid);

    console.log("Rendering Server React Components");
  res.render("index", {
    main: markup,
    uid: mainApp.uid
  }, function (err, markup){
    if (err) {
      next(err);
    }
    res.send(markup);
  });
};

if (loadAction){
  context.getActionContext().executeAction(loadAction, { params: state.params, query: state.query }, renderReactOnServer);
} else {
  renderReactOnServer();
}

我正在我的服务器中运行反应路由器的主要运行方法。

在客户端我正在运行以下

Router.run(app.getComponent(), Router.HistoryLocation, function (Root, state) {
        var RootComponent = fluxibleAddons.provideContext(Root,{
            getStore : React.PropTypes.func.isRequired,
            executeAction: React.PropTypes.func.isRequired
        });
        React.render(React.createElement(RootComponent, React.__spread({}, state, { context : context.getComponentContext()  })), document.getElementById(app.uid));
 });

在我的 client.js 中，react router run 的回调只调用一次，这对我来说很奇怪。没有可见的错误。有人有什么想法吗？

4

0 回答 0