barbajs-Views

weixin_34148340發表於2017-12-19

pushstate導航最困難的事情之一是處理和照顧不同頁面中的所有Javascript狀態/事件。
Barba.js提供了一個很好的幫手,可以幫助你將一個Container與一個View關聯起來。
所有的transitions都需要擴充套件Barba.BaseView物件。
要將一個View與一個Container關聯起來,一個公共名稱空間就足夠了:

<div class="barba-container" data-namespace="homepage">
var Homepage = Barba.BaseView.extend({
  namespace: 'homepage',
  onEnter: function() {
      // The new Container is ready and attached to the DOM.
  },
  onEnterCompleted: function() {
      // The Transition has just finished.
  },
  onLeave: function() {
      // A new Transition toward a new page has just started.
  },
  onLeaveCompleted: function() {
      // The Container has just been removed from the DOM.
  }
});

// Don't forget to init the view!
Homepage.init();

在呼叫Pjax.start()之前,建議先呼叫 Views的.init() - 通過這種方式,Pjax.start()將為當前view發出onEnter()和onEnterCompleted()。
如果您不喜歡data-namespace,您可以更改它,請參閱Dom API部分