Accessing Params in the Server for SSR

help
1

Hi!

I’ve just started to play around with this package that makes it super easy to integrate SSR.

The thing is I do not know how to access the route/query params or such url data from within the server component, and therefore I can’t render a specific content. So for the code below, I don’t know how I could inject the documentId into the Sample server component. It is probably a specific react-router syntax injecting as a prop…?

This is mainly because I can’t use hooks in the server, hence no useParams. But what’s the server alternative then?

Thanks!

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',
});
2

@copleykj he needs your help.

1 Like
3

Indeed it was easy! It is apparently possible to use hooks, specifically the useParams hook from react router itself.

So:

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>
}

Bamm!

1 Like