React Router：访问服务器中的参数以进行 SSR

Question

我刚刚开始使用这个包，它使得集成 SSR 变得非常容易。

https://github.com/Meteor-Community-Packages/react-router-ssr

问题是我不知道如何从服务器组件中访问路由/查询参数或此类 url 数据，因此我无法呈现特定内容。因此，对于下面的代码，我不知道如何将

documentId

注入到

Sample

服务器组件中。它可能是一个特定的反应路由器语法作为道具注入......？

TLDR：由于我无法使用钩子，因此无法使用内置的

useParams

钩子，因此如何访问服务器组件中的参数？

谢谢！

function Sample(props) {
    Meteor.subscribe('document', 'documentId');
    const document = Documents.findOne();
    return <h1>{document.title}</h1>
}

const AppRoutesSSR = [{
    path: '/documents/:documentId'.
    element: <Sample documentId='???documentId???' />
}, {
    ...
}]

renderWithSSR(AppRoutesSSR, {
  renderTarget: 'root',
});

Answer 1

事实上，显然可以使用钩子，特别是来自 React 路由器本身的

useParams

钩子。

所以：

import { useParams } from 'react-router-dom'

function Sample() {
    const { documentId } = useParams();
    Meteor.subscribe('document', documentId);
    const document = Documents.findOne(documentId);
    return <h1>{document.title}</h1>
}

嘁！