Navigation

The Navigate action allows you to navigate to a page in your application.

You can specify the page URL as a string or use a variable to reference the page URL.

/home

Using built-in {{routes}} object:

{{routes.home.url}}

You can also specify URL parameters, they will be available on the new page as:

{{activeRoute.queryParams}}

Opening a page in a new browser window

Currently, the Navigate action in UI Bakery doesn’t have a built-in option to open a page in a new tab. However, you can use the Code step to open a new tab with a specific app page. To achieve this, you can create a custom action and add a Code step with the following code:

window.open('page/url', '_blank');
return 1;

This code will open the specified page in a new tab when the action is triggered. You can then connect this action to a button or any other component trigger to open the page in a new tab when the event occurs.

Note, in some cases browser may block opening new browser tabs when the action is run by the “Run action button”, but should be fine if you trigger the action as a result of a UI component trigger (button click for example).