-1

I have page with tabs.

{
  path: '/settings/monitoring/:tab',
  component: MonitoringPage,
  exact: true,
  type: PRIVATE_TYPE,
},

There is useEffect, which get data for all tabs. There is function, which change tab:

const onChangeTab = (tabName) => {
  const tab = findTab(tabName)
  props.history.push(tab.settings.name, null)
  setSettings(tab.settings)
}

history.push change link, but also rerender app and useEffect work again. History push need to have access to tabs with link, how can I fix it, but have access to tabs with link?

Drew Reese
  • 165,259
  • 14
  • 153
  • 181
Никита Гончаров
  • 1
  • 1
  • Does this answer your question? [react-router: How do I update the url without causing a navigation/reload?](https://stackoverflow.com/questions/57101831/react-router-how-do-i-update-the-url-without-causing-a-navigation-reload) – Jax-p Aug 31 '22 at 11:58
  • What tabs? What `useEffect` hook? Your question makes little since because navigating to a new route will likely trigger a rerender, and enqueueing a state update will certainly trigger a rerender. Please edit your post to include a [mcve] so we've context for what any code is doing and what any issue possibly is. – Drew Reese Aug 31 '22 at 16:28

1 Answers1

0

Did you put dependency in the useEffect?

useEffect(() => {
//.... 
}, [tabName])

This will make the useEffect to run only when tabName is changed and not when it is re-rendered.

nightElf
  • 502
  • 2
  • 4