Partial Refresh with Portal

As said before, The results of an web.EventFunc could be:

• Go to a new page
• Reload the whole current page
• Refresh part of the current page

We have covered two. Now let's demonstrate refresh part of the current page:

web.Portal().Name("part1") Place a placeholder inside you page, and append web.PortalUpdate to er.UpdatePortals to update the portal with that name. Multiple portal can be updated at the same time.

Load Portal in separate AJAX request

With web.Portal, We can also load the portal with a separate AJAX request after page load. It is useful for the type of the content is not that important to the page, But load them are quite heavy. Like related products of a product detail page of a ECommerce site.

It is not only load the portal in separate AJAX request, Also you can reload it with ease er.ReloadPortals = []string{"related_products"} in an event func.

Under the hood, We use Vue's Dynamic & Async Components, to load Go generated html (vue runtime templates) from the server and mount those vue components into the page. It works the same way for reload the whole page, push state page switch, and refresh part of the current page.