jaredatron/simple-react-router

issues with using the Link component !

Closed this issue · 4 comments

a-eid commented

I'm trying to use the Link component as per the Readme and getting the following errors & warnings

proxyConsole.js:56 Warning: Failed context type: The context `redirectTo` is marked as required in `Link`, but its value is `undefined`.
    in Link (at Contact.js:18)
    in div (at Contact.js:15)
    in div (at Contact.js:14)
    in Contact (at App.js:51)
    in div (at App.js:48)
    in App (at index.js:8)

Warning: Failed context type: The context `location` is marked as required in `Link`, but its value is `undefined`.
    in Link (at Contact.js:18)
    in div (at Contact.js:15)
    in div (at Contact.js:14)
    in Contact (at App.js:51)
    in div (at App.js:48)
    in App (at index.js:8)

Warning: Unknown prop `redirectTo` on <a> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in a (created by Link)
    in Link (at Contact.js:18)
    in div (at Contact.js:15)
    in div (at Contact.js:14)
    in Contact (at App.js:51)
    in div (at App.js:48)
    in App (at index.js:8)

Uncaught TypeError: this.context.redirectTo is not a function
    at Link.onClick (Link.js:48)
    at Object../node_modules/react-dom/lib/ReactErrorUtils.js.ReactErrorUtils.invokeGuardedCallback (ReactErrorUtils.js:69)
    at executeDispatch (EventPluginUtils.js:85)
    at Object.executeDispatchesInOrder (EventPluginUtils.js:108)
    at executeDispatchesAndRelease (EventPluginHub.js:43)
    at executeDispatchesAndReleaseTopLevel (EventPluginHub.js:54)
    at Array.forEach (<anonymous>)
    at forEachAccumulated (forEachAccumulated.js:24)
    at Object.processEventQueue (EventPluginHub.js:254)
    at runEventQueueInBatch (ReactEventEmitterMixin.js:17)
    at Object.handleTopLevel [as _handleTopLevel] (ReactEventEmitterMixin.js:27)
    at handleTopLevelImpl (ReactEventListener.js:72)
    at ReactDefaultBatchingStrategyTransaction.perform (Transaction.js:143)
    at Object.batchedUpdates (ReactDefaultBatchingStrategy.js:62)
    at Object.batchedUpdates (ReactUpdates.js:97)
    at dispatchEvent (ReactEventListener.js:147)
jaredatron commented

the <Link> component must be rendered within the <Router> component so it can provide the redirectTo context variable.

https://github.com/deadlyicon/simple-react-router/blob/master/src/Router.js#L36

it sounds like you're trying to render a link outside of your router. Maybe you're rendering a navbar outside of the router? If so I recommend putting the router near the top level of your react tree and then rendering your navbar or layout form within each Page component you rout to.

Here is an example:

jaredatron commented
a-eid commented

@deadlyicon ,
I actually was in a harry so I switched back to "react-router".
I will give it another shot soon and I will let you know ,

I will reopen if I got the same issue .

Thanks for the help

jaredatron commented