我正在尝试使用 react-router 和 express.js。我的最终目标是:
- 当 URL 到达服务器时，它将使用服务器端呈现来呈现输出。
- 一旦进入客户端，以后点击
Link组件将导致react-router在客户端呈现(无需与服务器进行完整的往返).
到目前为止我得到了什么:
- 使服务器渲染像this .
- 当我在客户端上呈现时，使
Link组件正常工作。
我的问题:
- 一旦我在服务器上呈现，输出就不是交互式的。我的意思是，没有事件处理程序与 DOM 关联。这是可以理解的。不过，我正在寻找的是一种混合服务器和客户端呈现的方法。我的意思是，服务器呈现输出，但它以某种方式在客户端中进行交互。如果我得到这个，我将能够在客户端上使用
Link，这将满足我的需求。
最佳答案
如果您在客户端调用 React.render(component, element)，其中 element 指向包含服务器呈现的 React 标记和 的 DOM Node component 使用与服务器上相同的 props 实例化(并假设 props/state 一直匹配)，React 将透明地将您的静态标记升级为交互式 React 应用程序。
参见 this JSFiddle example演示了这种技术:http://jsfiddle.net/BinaryMuse/ddvdppeg/ (请注意，在标记升级为交互式应用程序之前有 1 秒的延迟，但仅用于演示目的)。
关于javascript - 如何让 React-Router 呈现服务器的交互式输出？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29909006/