React-router: How to do multiple optional params with react-router?

[littlee]

I am working on a search page.
And the page should have some filter condition
and the url look like this in regular way:
?sort=price&type=a&rangeStart=10&rangeEnd=100
how do I make it in react-router way?

I was think about I can do it in this way, because the params is optional,
so the route could be
/search(:/sort)(:/type)(:/rangeStart)(:/rangeEnd)

but how do I know which query is passed in url, and which not?

[taion]

Thanks for your question!

We want to make sure that the GitHub issue tracker remains the best place to track bug reports and feature requests that affect the development of React Router.

Questions like yours deserve a purpose-built Q&A forum. Could you post this question to Stack Overflow with the tag #react-router? https://stackoverflow.com/questions/ask?tags=react-router.

We also have an active and helpful React Router community on Reactiflux, which is a great place to get fast help with React Router and with the rest of the React ecosystem. You can join at https://discord.gg/0ZcbPKXt5bYaNQ46.

[icem]

@littlee have a look at query params examples https://github.com/rackt/react-router/blob/master/examples/query-params/app.js

let { query } = this.props.location
let age = query && query.showAge ? '33' : ''

[littlee]

thanks

[eldyvoon]

@icem The link is dead, can you post a working link?

[littlee]

https://github.com/ReactTraining/react-router/blob/v3/examples/query-params/app.js

@eldyvoon

[loopmode]

So basically the lesson here is: you don't have to declare query params in a route at all, whatever queryParams exist at runtime will be available via location.query anyways. Right?