Comments (6)
I am getting an error:
Error: use-react-router may only be used within a react-router context.
Using next versions of react-router, react, & react-dom.
here is a codesandbox.
from use-react-router.
What version of react-router
are you using? The installation instructions mention 4.4+, using react-router@next
to get that version. If that doesn't fix your issue, let me know your version (4.4+), and I'll try to match this package to that react-router
version.
from use-react-router.
The version I am using is react-router": "^4.4.0-beta.6
. Perhaps I wasn't clear in my original explanation as I'm only suggesting to add a warning or error upon using this hook outside the context of react-router
.
To clarify; I have a test in which I was testing a component that uses the use-react-router
hook but I was not initializing a StaticRouter
or BrowserRouter
around the component:
import ComponentWithHook, { Props } from '...';
import renderer from 'react-test-renderer';
test('should render component', () => {
const component = renderer.create(
<ComponentWithHook />
);
let tree = component.toJSON();
expect(tree).toMatchSnapshot();
});
Therefore it gave me the aforementioned error:
Cannot destructure property `history` of 'undefined' or 'null'.
19 | active
20 | }) => {
> 21 | const { history } = useReactRouter();
| ^
22 |
23 | const classes = active
24 | ? 'slider__item slider__item--active'
Which got me confused for a bit why it would not unpack { history }. Of course it made sense after thinking about it, and I came to the conclusion that I was missing the react-router
context. Perhaps the following message would be nice:
Warning: you're using use-react-router outside the router-context
Sorry for doing a poor job of explaining in my original comment. Merry christmas!
from use-react-router.
Gotcha. An error message for this scenario should be deployed in 1.0.3
. Thanks for the feedback!
from use-react-router.
Can you provide the specific version number of react-router as listed in your package.json file?
from use-react-router.
Hmm. In the codesandbox it's not working (same problem that I originally had), but if I download it and install/run it locally it does. I used next
in package.json, and pulled use-react-router out of the app when it wasn't working, so I'm not sure what version it was using. Now, locally it's 4.4.0-beta.6
(check package-lock) and that seems to work ok, so I will give it another try in the original app.
from use-react-router.
Related Issues (19)
- Add Travis key
- Provide a more informative error message for [email protected] or earlier. HOT 4
- Cannot find SourceMap 'use-force-update.js.map' HOT 1
- Failed to compile HOT 2
- Any example in the docs? HOT 4
- Subscribing to location changes might be a no-op. HOT 4
- why do we need a force update? HOT 1
- Types section is missing in package.json
- Typing errors with updated @types/[email protected] HOT 2
- Incorrect error is thrown when react-router Provider is missing. HOT 11
- Pin peerDependency of react-router HOT 1
- does not read updated parameteres HOT 1
- Thank you! HOT 1
- Allow to use within MemoryRouter HOT 2
- useReactRouter may only be called within a <Router /> context HOT 5
- impossible to get params using typescript HOT 2
- Perhaps add to the docs official implementation? HOT 1
- Ask people to use 5.1 instead? HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from use-react-router.