Redirect
Redirect
is a component that immediately redirects the browser to the URL in its to
property when it gets visible (its when
property gets true
). The redirection works only within the app.
Using Redirect
The following app demonstrates two different patterns for using Redirect
.
- When you navigate to the "Redirect #1" page, it immediately redirects the app to the "Accounts" page. By default, the
when
property ofRedirect
(and any other component) is "true", so redirection immediately happens. - The "Redirect #2" page expects you to click the button before redirecting. The button click sets the
when
property ofRedirect
to true, and redirection happens at that moment.
<App>
<NavPanel>
<NavLink to="/">Home</NavLink>
<NavLink to="/accounts">Accounts</NavLink>
<NavLink to="/products">Products</NavLink>
<NavLink to="/redirect1">Redirect #1</NavLink>
<NavLink to="/redirect2">Redirect #2</NavLink>
</NavPanel>
<Pages>
<Page url="/">Home</Page>
<Page url="/accounts">Accounts</Page>
<Page url="/products">Products</Page>
<Page url="/redirect1">
<Redirect to="/accounts" />
Redirecting to Accounts...
</Page>
<Page url="/redirect2">
<Fragment var.clicked="{false}">
<Button label="Click to redirect" onClick="clicked = true"/>
<Redirect when="{clicked}" to="/accounts" />
Redirecting to Accounts...
</Fragment>
</Page>
</Pages>
</App>
Try the app!
Properties
to
This property defines the URL to which this component is about to redirect requests.
Events
This component does not have any events.
Exposed Methods
This component does not expose any methods.
Styling
This component does not have any styles.