I am attempting to transition from Blaze/FlowRouter to React/React Router, and built a simple application called meteor-application-template-react to help me understand how Meteor, React, React Router, and Semantic UI all work together.
My problem occurs when I navigate to a page where the URL contains docID information: things work correctly when I navigate to the page using a React Router Link, but if I then refresh, the page displays but without the data.
For example, say I am on this page, which lists data in my sample app:
I can click the Edit button to go to a page to Edit some data:
So far so good. But now, if I hit the browser’s refresh button, the page displays but without the data:
I have learned about the client vs. server side routing, and since I am using HashRouter (and since the page displays), I assume there is something wrong with the reactive data binding? But if so, why does this only occur on the refresh and not the original page display?
Clearly there is something I don’t understand about React, React Router, and/or Meteor. Can someone please explain why this is occurring?
It’s probably helpful to take a quick look at the source code for the EditStuff.jsx page.
The router stuff is in App.jsx.
Thanks in advance!