Allow slashes in url parameters (useParams) react router v6 - react-router

I have a route like this:
<Route path="signup/:id" element={<SignUpPage/>}/>
But the problem is that the id in the url is a client id and it contains many trailing slashes (eg. signup/jhagsd==/sfdfsdf/dsdfgf) and due to this the router considers this as a new route instead of a param after "signup/".
How to extract everything after "signup/" as param from useParams() hook?

Related

How to preserve query params using <Route> in React Router V6?

I don't see any mention of a "search" parameter on Route
https://reactrouter.com/en/main/route/route
Currently, at least for my project, params are lost when a new route is matched and applied.
Does anyone know the best way of ensuring any existing search params are re-applied after a route change?

How to read UTM tags and redirect url in react

I have an URL with UTM tags as below. When a user clicks/ hits the below URL(source), I would like to read UTM tags and redirect to another url(target).
Does anyone have a documentation link to read UTM tags and redirect the url in react?
Example:
Source
https://www.CustomDomain.com/?utm_source=linkedin&utm_medium=email&utm_campaign=sale&utm_id=123&utm_term=job&utm_content=ad
Target
https://www.CustomDomain.com/dashbord
With the latest react-router-dom *v6*, you can use a new hook named useSearchParams. Use it to get query params and you can then store them into localStorage,:
const [searchParams, setSearchParams] = useSearchParams();
searchParams.get("utm_source"); // similar for the rest of query params
With React router v4, You need to use this.props.location.search for generic or this.props.location (with useLocation) for functional components and parse the query parameters either by yourself or using a package

Search query for JSON data by url

I'm using the following url for my JSON data.
myapp/laravelRoute/jsondata
when entering this in address bar, following JSON array will be displayed
[{"A":"B"},{"B":1},{"C","http"}]
But, when I enter the url as,
myapp/laravelRoute/jsondata?search=B
it shows the entire array instead showing the search result. How I do this correctly?
After doing the code view I found that the array route is configured for a default route in Laravel Routes. So, in any case that open a path except mentioned ones in routes will redirect to the default path.

Flask route to a variable url

I want to be able to route to a specific user's profile using flask as a web server but the user's profile name will be different so how would implement this?
The variable is surrounded by square brackets in the URL and passed to the view function as a regular parameter.
Assuming you have a template called profile.html and want to pass user data to that template from function getUser, your route would look like this:
#app.route('/profile/<username>')
def profile(username):
return render_template('profile.html', user = getUser(username))

Angular Route vs $Resource

So I have a few REST URLs that I would like to load and bind to html when requested. When user searches for first name and if first name is found html gets populated from json. This works fine (Initial URL).
Initial URL
var url = http://localhost:8080/userSearch/name/find?firstName='+enteredValue.firstName+'&lastName=&
$http.get(url).success(function(data){
$scope.dataItems= data;
Now using ng-click on first name I want to request address and location based on these URLs
//URLs
var url = http://localhost:8080/userSearch/addr/find?address=&address
var url = http://localhost:8080/userSearch/loca/find?location=&location
So I started looking into UI-Router and $Resource. My first thought is to use $Resource but seems as if others have had problems with ports.
Could I use Router as well to solve this problem or should I stick with Resource?
ui-router and $resource are completely different things. ui-router is used to provide navigation between different states in your app while $resource is used to make calling server side APIs more convenient. If you need to retrieve data from a RESTful backend then $resource is the way to go. I'm not sure what you're referring to about the ports but I've built web applications that service millions of users daily on top of $resource and not had any port problems.