0

I used history.push to redirect to my desired url and passed an information via the included state to the next route like this:

const history = useHistory()
history.push({
   pathname: '/someurl/',
   state: {
      foo: bar
   }
})

and in JavaScript this worked absolutely as expected. Now I am migrating this file to TypeScript and I am getting the following error:

Argument of type '{ pathname: string; state: { foo: bar; }; }'
is not assignable to parameter of type 'To'.

Object literal may only specify known properties, and
'state' does not exist in type 'PartialPath'

For some reason he thinks that I only pass a pathname without a state right? Does anyone know how to fix that?

PRSHL
  • 1,359
  • 1
  • 11
  • 30
  • Do you mean `pushState` not `push`...? – Keith Dec 01 '21 at 15:38
  • Uhmm, I guess it should be `.push` at least thats what I did in js when it worked. – PRSHL Dec 01 '21 at 15:39
  • The `history` object doesn't have a `push`, did you have some lib that added it? – Keith Dec 01 '21 at 15:39
  • yeah i accessed it by using `useHistory` and the returned history object doesn't have `pushState` – PRSHL Dec 01 '21 at 15:40
  • 1
    Ah!! `useHistory` is not the same as `window.history`, so that might explain things. What version of definitelyTyped are using for react-router.? – Keith Dec 01 '21 at 15:46
  • I am using `5.3.2` .. found this stackoverflow topic with the same problem but his proposed solution doesn't change anything for me.. :( https://stackoverflow.com/questions/62792224/how-to-use-react-router-usehistory-hook-with-typescript – PRSHL Dec 01 '21 at 15:48
  • Okay, figured it out and I would be easier to solve if I followed the hints from vsc... `history.push('/someurl/', {foo: bar})` works – PRSHL Dec 01 '21 at 16:04
  • Using react-router `5.2.1` works for me too, How are you getting version `5.3.2`?. As I can tell 5.2.1 is the latest before version 6.. – Keith Dec 01 '21 at 16:16
  • Sorry, that was a typo :D `5.2.1` but anyway it works now :) thanks – PRSHL Dec 01 '21 at 16:32
  • @Keith Unless there's been another version bump in the last few days v5.3.0 is the latest v5 version. The API didn't change from v5.2.1 though. – Drew Reese Dec 01 '21 at 16:36
  • You seem to be using a custom history object in your project, can you confirm what version of `history` package you are using and how you are configuring your router? I suspect the code is correct (*it sounds like it works as expected*) but Typescript might not be referring to the correct version of `history`. – Drew Reese Dec 01 '21 at 16:38
  • Okay I checked again and I am using `"react-router-dom": "^5.2.1"` and `"@types/react-router-dom": "^5.3.2"`.. but the solution i mentioned above works fine :) – PRSHL Dec 01 '21 at 16:55
  • And what about the `history` version and router usage? The "standard" `history.push` takes two arguments. I think you should be on v4.x of `history`, v4.10.1 is latest v4. – Drew Reese Dec 01 '21 at 17:09
  • Oh sorry, that was nonsense what I was posting. Somehow thought of react-router-dom .. my history version is `"history": "^5.0.0"` – PRSHL Dec 01 '21 at 18:07
  • Try reverting back to a v4 version of `history` package. – Drew Reese Dec 01 '21 at 22:34

1 Answers1

-1

Same issue resolved by after trying to fix it I found the problem appears when using custom history, like import history from 'history'; and then <Router history={history}>...</Router> So when I replaced it with <BrowserRouter>...</BrowserRouter> the problem disappeared.

Rex
  • 1
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 01 '21 at 15:52