Cannot read properties of undefined (reading 'pathname'). problem when I click other Link from the page
JavierBeni opened this issue ยท 8 comments
Hello.
I am using this library, and I have problem with it.
I am using it with react-route v6.
the version of this library is 5.0.8
I have same config than in the example, but when I change between webpages, i see this:
my store is:
import { createStore, combineReducers, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import createSagaMiddleware from 'redux-saga';
import { createBrowserHistory } from 'history';
import { createReduxHistoryContext } from 'redux-first-history';
import { redesign } from './redesign/redux/reducers';
import { v04 } from './redesign/redux/reducers/v04';
import sagas from './sagas';
const sagaMiddleware = createSagaMiddleware();
const historyApi = createBrowserHistory();
const { createReduxHistory, routerMiddleware, routerReducer } = createReduxHistoryContext({
history: historyApi,
savePreviousLocations: 10
});
export const store = createStore(
combineReducers({
router: routerReducer,
redesign,
v04
}),
composeWithDevTools(
applyMiddleware(sagaMiddleware),
applyMiddleware(routerMiddleware)
)
);
sagaMiddleware.run(sagas);
export const history = createReduxHistory(store);
The router is like:
import { history } from './store';
import { HistoryRouter as Router } from 'redux-first-history/rr6';
const App = () => {
return (
<Router history={history}>
...
</Router>
);
}
And inside the routes:
const component = () => {
...
return (
<Routes>
<Route path="/" element={<Navigate to="/homepage" replace />} />
<Route path="homepage" element={<StartPage />} />
...
<Route path="*" element={<NotFound />} />
);
}
I am think I am skiping something easy and short. but I cannot fin it.
This is happening when I am updating to v6 of react and also this library to last version.
After error, if I reaload the page, page works.
Also, I am looking in the redux, the state of path doesnt change. Before yes.
Thanks for your time.
Kind regards.
@JavierBeni please che you provide a code sandbox demo?
@salvoravida ok, I will try to reproduce it. but its a big project, so I don't know if I would can.
Anyway, did you see this bug before?
No. The most probable thing is that there is a bug in your code, but without a code sandbox it's not possible to help you.
Cannot provide help without a sample code. Please feel free to reopen the issue as you post a code sandbox example.
ok.
I am creating project.
for now, I dont see any problem in the sandbox.
I will continue adding elements of my project and testing
thanks by your time.
Hi.
Finally the problem was the version of the "history" library. It must be bigger than 5.0.0
I write the comment for other people can see it if they have same problem.
Regards and thanks!
fyi @salvoravida
Hi. Finally the problem was the version of the "history" library. It must be bigger than 5.0.0
I write the comment for other people can see it if they have same problem.
Regards and thanks!
fyi @salvoravida
Oh great!.
Generally, you do not have to add the history package, as it is a dep of react-router
react-router v5 install history v4
react-router v6 install history v5
@JavierBeni thanks you saved me.