Routing to a component with the default values - reactjs

In React application I had implemented routing.
In login component -> Accepting Username and Password.
If valid -> bookticket component -> Two buttons in this page - Viewshows and BookTicks.
Viewshows will display movie details.
BookTicks will route to BookTicks component.
After clicking on Viewshows, am clicking on book ticket button, so it will route to accept some user info for booking.
So my problem is I want to go back to bookticket component where only those two default buttons should be there. The table and other details should not be there.
I tried with history object but this is displaying buttons and also the details which I had viewed earlier.
this.props.history.push('/bookticket');
If a tag is used, its getting into 404 error, because it is deployed in IIS.

Related

How to add go to button on my landing page

I have two separate projects and two separate domains called (.com & app.com).
the (.com) domain project is the landing page of my website and this page is developed using HTML and CSS. in this page I have one button called login if the user clicks on the login button the user is redirected to the app.com project.
so my question is how to check whether the user is authenticated or not in my (.com) domain project.

How can i change a component according to url but not change the page? React

For example i have a page /profile on there, the user isshowed his profile picture. When the respected user clicks on it, it changes to /profile/avatar. But, i dont want to change the page but show a component which otherwise will not be shown in /profile. Think of it as when you click on another's avatar in twitter, it changes to /#elonmusk/pfp a modal shows the image but it doesnt unmount the previous page
How can i implement that?

How to Route user to a specific part of a page

I am working on a project where we have a subscriptions plans container at the home page of the app.....when we are the at the other route where the user need to buy subscription....so there we provide the button to buy subscription....but what i want is when the user click that button i want to route the user to the specific part where the component of the subscriptions plans is......To make this work what i tried is....i gave the parent component of that area an id of subscriptions....then when the user is at different route and he click that button there i also gave a tag with a href of that id i.e. #subscriptions.....but its not working........and i hope you'll understand what i am trying to say.
here if the user havn't bought the subscription i want him to route to home page to buy subscription
This is the area where i want the user to route to. (Not the top of the page like a normal react-router do)

Routing to same page with anchors

I'm new to react router and currently implementing a page with navigation.
The top part is navigation followed by content part.
Currently when someone clicks on localhost:8080/page it renders a component in the content part.
On click on one of the nav items page redirects to localhost:8080/page#my-anchor also the content below renders another component.
When clicking back button, the URL changes to localhost:8080/page but the content doesn't get updated.
How to handle the update of content with browser back & forward buttons?

How to remove/delete or skip a state in angular

I am trying to skip a state after logout in angular ui router SPA. But I am unable to acive this.
dashboard -> login -> view details -> logout -> dashboard
I am logging in dashboard and moving to details state and logging out there. On logout I am moving to dashboard. Now, if I press back button It is again going to view details page. How can I prevent to moving there. Please help me. How can I remove that view details state from history on logout. Of course the history not containing this page bcoz it is SPA. Button I observed them in browser back button long press

Resources