I am trying to define a react-router with an optional url parameter prefixed with a namespace. This is an example of such a path:
path="authors/:authorId/posts/:postId?"
// application.com/authors/8/posts/4
I want the postId variable part to be optional, but this should include the whole /posts/:postId part to be optional. Is this possible?
Not sure why this is a thing that some developers want (haven't seen a good use case scenario where you would need to structure your URL as such), but the simplest solution is to instead just use a query.
http://www.example.com/authors/author?authorId=8&postId=4
Nonetheless, while the answer provided below is specific to the question, the set up for your desired URL structure is the same (see second approach in the answer): React Router v4 Nested match params not accessible at root level
Related
I'm using React Router v6 (Beta) and have a requirement to allow a path as a param, eg.
"some-url/:folderPath" -> "some-url/some/path/to/a/folder"
This is proving trickier than I expected, though I recognize the obvious confusion caused by slashes being URL delimiters. I found this answer that suggests that at some point React Router allowed for a "+" that would allow the URL param to include everything following that point in the URL, though it no longer appears supported.
Is there an explicit way to approach this problem using the React APIs?
You can encode any character using URL encoding. The encoding for forward slash is %2F. If you replace all the slashes with %2F it should work. You can also call a function that will URL-encode a string.
See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
EDIT:
That being said, the comment by #Linda Paiste is a superior solution.
I need to register to a state, a route where the parameters has a prefix and a slash
(route/to/parPrefix1/:paramValue1/parPrefix2/:paramValue2)
and these parameters are all optional, so if the parameter1 is not set, the resulting url should be:
route/to/parPrefix2/value2
How can I handle this case?
Then I have a second issue:
the date should be specified like this: 20/10/2015
If i solve the first point I could set a parameter per date part, however, is there a more elegant solution?
a real case url: /risultati/destinazioni/:destinations/localita/:locations/partenza/:startingDate/ritorno/:returningDate/adulti/:adults/bambini/:children/eta/:childrenAges/aeroporti/:airports/flessibile/:flexDate/
You most likely need to set up multiple routes, that point to the same view:
ex:
route/to/parPrefix1/:paramValue1
route/to/parPrefix1/:paramValue1/parPrefix2/:paramValue2
I agree with spanndemic, see http://benfoster.io/blog/ui-router-optional-parameters.
Also I think that most of that data should be passed via services or values.
Such a long url will always make things much more difficult.
I am using angularjs router, as the application development is almost done, I cant use UI-router. Recently I implemented two optional parameter in route by following this answer.
Here is what I did.
app.when('/someUrl/:param1?/:param2?',{
templateUrl:'templateurl',
controller:'controllerName'
});
But when I use $location.path('/someUrl/1234/5678');, the url is adding equivalent hex code of '?' in URL either parameter is available or not.
I am not sure why this parameter is coming even if I am sending parameter.
the url is looking like
localhost/someurl/1234%3F/5638%3F
How can avoid this %3F and keep optional routing functionality without using duplicate route definitions.
**Sorry for typo mistake, I already defined routes with :, that is not problem with :.
%3F is ?, Since you have not provided the : its treated as part of URL thus they are encoded.
You need to use : to define parameter.
app.when('/someUrl/:param1?/:param2?',{
templateUrl:'templateurl',
controller:'controllerName'
});
I'm using Backbone.js and I have a url to my collection followed by a param string - the params can occur in any order, the number of params can vary.
mywebsite.com/?orderBy=recent&author=Smith
mywebsite.com/?author=Smith&type=Horror,Romance
So in a way the /:param isn't ideal unless I define an order that they have to be in in the url:
/:orderBy/:author/:type...
and allow some of them to be null somehow.
What's the best way to set this up?
Would a router with regex answer my problems?
If so, I can't find examples of a router using regex to pass multiple arguments to a routing function in Backbone.
Thanks!
I had the same problem. Here is a backbone plugin that does the job:
https://github.com/jhudson8/backbone-query-parameters
Cheers!
I don't believe your url parameters should map query strings much like how restFul interfaces don't map the query strings.
/cars?filterby=12 would be more correct then some sort of /cars/filterby/12
I understand rest isn't an applications routes but they still have the same caveats.
jQuery contains a $.param function for easily dealing with querystrings and jQuery BBQ contains a $.deparam util which can parse querystrings
Keep your routes simply
mywebsite.com/#/authors?orderBy=recent....
How do I do a simple route in CakePHP?
I need that each and every URL will be routed by swapping the action and the controller.
I just couldn't understand the placeholders syntax.
Example:
/files/read/3
to
/read/files/3
-- supplemental --
In my application I use aliases for the controllers.
and I want to route every url that have a certain keyword, as an action, to a certain controller.
I also want to provide the original controller name as a parameter.
Here is a 1:1 example:
There are to alises: fruits and streets.
The keyword that I want to catch in the action is find.
The new controller name is finder.
The following calls match my condition:
/fruits/find/apple/red and /streets/find/longer
The router should catch these urls and convert them, to:
/finder/fruits/apple/red(or supply the parameters in other way, I don't mind) and /finder/streets/longer
How should it be done?
Here is the line of code that you need to put in /app/config/routes.php:
Router::connect('/:action/:controller/*', array('controller' => ':controller', 'action' => ':action'));
Know more: As you can see from the CakePHP book, there are some 'reserved' patterns for routing configuration. An example would be what I used in the line above: :action and :controller. These patterns allow you to tweak routes extensively.
Beware: changing the order of controller and actions in urls might have unintended consequences in the functionality of other CakePHP features. I haven't tested thoroughly, but this is just a general warning.
Beware: Also, I noticed that you put in your example: /files/read/3. Maybe this was just some dummy example, but if you indeed plan to have an MVC named as 'file', be advised that it will conflict will CakePHP core classes (e.g. File model will conflict with File class).
Anyway, hope this answer helps you well. And I really like how the change of controller and action names make the url more readable. :D