Links
View Paths
Each view has a unique path (which you specify when you create a view), which is used to link to it.
Defining Links
Example:
To link between views, the link must be defined in the view. Buttons refer to links by name.
Parameters
A view may define parameters, that must be passed to the view when linking to it. Arguments are specified in the same order as the parameters — the parameter name has no visible effect outside the view defining it.
For example, if suppose we have this view with a path of user/new
:
Then we would link to it from a button as follows:
Linking from JavaScript
Note that there are two ways to call links in JourneyApps:
- Directly from a button component by specifying
link=""
on the button (as shown above) - Calling the link from JavaScript using the
return link.link_name
syntax. See the Calling Links section of JavaScript Introduction for more information. This way of calling links also allows you to embed logic when the user presses a button instead of simply calling a link directly.
Closing Views
To save and close a view on a button press, use the built-in action "dismiss". Example:
This will automatically save all objects defined in the view.
Closing Multiple Views (Dismiss Links)
To close multiple views, for example to return to the main menu, a dismiss
link can be used. Create a normal link
to the view the app should return to, but add type="dismiss"
.
ondismiss Actions
A callback action can be defined on a link, that is called whenever the linked view is dismissed.
Example:
... and the JavaScript:
Ondismiss actions may also be chained with ondismiss="dismiss"
. However, it is recommended to use a dismiss link
instead.
View Cycles
Whenever a new view is opened, it is placed on the View Stack. The view stays on the stack until the user either presses
the "back" button on that view, or the view is closed with dismiss()
or a Dismiss Link (see above).
If there is a way for a user to navigate from a view to the same view, without using back or dismiss, this is called a view cycle.
In the simple example above, the user can navigate from second to main, forming a cycle. The view stack will then look like this:
main
first
second
main
The user can repeat that, now the stack will be:
main
first
second
main
first
second
main
If the user repeats the process multiple times, the view stack will keep on growing indefinitely. This may cause:
- Application becoming unresponsive.
- Application crashing.
- Screen flickering when finally following a dismiss link.
- Other weird issues and errors.
The solution in this case is to use a Dismiss Link (see above) from second
to main
, resulting in a view graph like
this:
Other examples
In the example below, the add_item
view links to itself, allowing the user to add multiple items in succession,
before finally returning to the list
view with a dismiss link.
If the user only adds a few items, this should not be an issue. However, if the user adds a few dosen items, the symptoms explained earlier may be experienced.
There are some alternatives:
- Instead of opening a link when adding a new item, save the current item and clear the fields, without any navigation.
- After saving an item, dismiss back to
list
. Then in theondismiss
handler oflist
, check if more items should be added. If another item should be added, open theadd_item
view again.
Both the above solutions will ensure that add_item
is never on the stack more than once, preventing the
issues that can be experienced with view cycles.
Advanced: Disabling the warning
There are some valid uses cases for cycles, as long as the view stack does not keep on growing indefinitely. In these cases, the warning may be disabled. To disable the warning for all outgoing links in a view, place the following in the JavaScript for that view:
// cycles-ok
Often it will only be necessary to place that in a single view, making a break in the cycle.