B4J Tutorial [BANanoVuetifyAD3] Important Information about Navigation Guards

Hi there

These are primarily used to guard navigations either by redirecting it or cancelling it.

Global Navigation Guards

You have beforeEach (page) and afterEach (page), these can be placed in pgIndex.

'before each page is rendered
Sub beforeEach(boTo As Map, boFrom As Map, boNext As BANanoObject)   'ignoreDeadCode
    Log("beforeEach...")
    vuetify.Loading(True)
    Dim sToPage As String = boTo.Get("name")
    Log(boTo)
    Log(boFrom)
    'the page we are going to
    'vuetify.SaveRoute(boTo, False)
    'check authentication
    'If vuetify.Authenticated = False Then
        'user is not authenticated, go to login page
    '    vuetify.NavigateToNext(boNext, "login")
    '    Return
    'End If
    'continue navigation
    vuetify.NavigateToNext(boNext, "")
End Sub

You can get the name the page the app will navigate to and depending on that process whatever command.

'after each page is rendered
Sub afterEach(boTo As Map, boFrom As Map)   'ignoreDeadCode
    vuetify.Loading(False)
End Sub

For example, above we are saying, before each page, show the loader and afterEach page, hide the loader.

NB: If you use global navigation guards in pgIndex, there is no need to have local navigation guards.

Local Navigation Guards

You have beforeEnter. This called before the beforeCreate Life Cycle Event. In this example we show a loader and hide it on mounted. These are placed per route component page, ie. class with AddRouter call

Sub beforeEnter(boTo As Map, boFrom As Map, boNext As BANanoObject)   'ignoreDeadCode
    vuetify.Loading(True)
    'the page we are going to
    'vuetify.SaveRoute(boTo, False)
    'check authentication
    'If vuetify.Authenticated = False Then
    'user is not authenticated, go to login page
    '    vuetify.NavigateToNext(boNext, "login")
    '    Return
    'End If
    'continue navigation
    vuetify.NavigateToNext(boNext, "")
End Sub

Sub mounted
    'hide the loader
    vuetify.Loading(False)
End Sub

For more details, see the Kitchen Sink.

 

[Mashiane]

1. NavigateToNext - this will use the boNext object to navigate to your page of choice or the current page. When the 2nd parameter is blank, you continue to the current page.
2. NavigateAbort - this will use the boNext object to cancel the current navigation and go back to the boFrom page
3. SaveRoute - use this to save the current URL of the opened page to a LocalStorage "lastpath" key. This can be used for pages other than the login page. You can include a "redirect" query parameter to your page so that the app redirects to that page next time. Use NavigateToRedirect to navigate to a default page or the "lastpath" localstorage key. This works like NavigateTo below and is useful after loging a user and authenticating them. It will read the "redirect" from the lastpath saved. This is useful for URLs sent via email.

Other Navigation Methods

NavigateTo - will navigate to any page in the app you specify, use the 'name' of the page prefixed by /
NavigateToWithParams - navigate to another page and use parameters. These are hidden on the address bar. This works with GetParams / GetParamValue
NavigateToWithQuery - navigate to another page and use query string. These are shown on the address bar. This works with GetQuery / GetQueryValue
GoBack - navigate back using code (uses history)
GoForward - navigate forward using code (uses history)