Views

Views allows you to have some logic related to the content of a namespace.
It’s a good place to init or destroy things, making the code run in a confined place.

They use a subset of base hooks.

Summary

  1. Syntax
  2. Programmatic use

Syntax

1
2
3
4
5
6
7
8
9
10
11
12
13
barba.init({
  views: [{
    namespace: 'index',
    beforeLeave(data) {
      // do something before leaving the current `index` namespace
    }
  }, {
    namespace: 'contact',
    beforeEnter(data) {
      // do something before entering the `contact` namespace
    }
  }]
});

Keep in mind that a view is always related to a unique namespace.

Programmatic use

In some cases, you may want to programmatically call a View inside your code, this is possible since Barba store all your views by namespace internally.

1
2
3
4
5
6
7
8
// return all views as a Map
const views = barba.views.byNamespace;

// get the view of the `home` namespace
const homeView = views.get('home');

// call the home `afterEnter` view
homeView.afterEnter();
Transitions Strategies