It changes url in browser , but view stays the same

[tombohub]

I've created dynamic route.
First time I click on navigation takes me to route and view, but second time changes route and url in browser, but view stays the same.

Do you know what could be the reason?

EDIT: it's because I was keeping initial data in react state and it kept it after route change keeping rendered same old data. Can you please comment on this? How to work with it?

[MichaelDeBoey]

From what I read, I think the problem is that you're syncing state instead of deriving it.

Have a look at Kent's blogpost about it: https://kentcdodds.com/blog/dont-sync-state-derive-it

[sergiodxa]

it's because I was keeping initial data in react state and it kept it after route change keeping rendered same old data. Can you please comment on this? How to work with it?

I would not keep a state with the data from the loader/URL, but if for some reason you need to and you can't find a way to don't do it. You will have to run an effect to sync any change from the loader data/url back to your state, and ensure you don't overwrite unsaved changes done by the user.

[tombohub]

@sergiodxa thanks, what's the practice for filtering products in e-commerce then? Is it to keep filters in url query params?

[kiliman]

Definitely try to use the URL for things like filters, sorting, paging, etc. The nice thing about storing data in URLs is that it can be bookmarked/shared and you'll get the same results.

Here's a sample.
Live site: https://remix-scoped-params-production.up.railway.app/tab1
Repo: https://github.com/kiliman/remix-scoped-params