javascript - 在另一个 Marionette.ItemView 中调用函数

Question

我有一个 ItemView，我在其中使用了 clearSearch() 函数。我需要在另一个 ItemView 中调用相同的函数，所以为了让它保持干爽，我尝试调用 clearSearch()，但没有成功。

View.Panel = Marionette.ItemView.extend({
    template: panelTpl,
    events: {
        'click .search_clear': 'clearSearch',
    }
    clearSearch: function() {
        //some important actions
    }
});

View.Pagination = Marionette.ItemView.extend({
    template: paginationTpl,
    events: {
        'click .page': 'changePage'
    },
    changePage: function(e) {
        //others important actions
        clearSearch();
    }
});

我也尝试过使用 View.Panel.clearSearch()，但我遇到了这个错误:

Uncaught TypeError: Object function (){return i.apply(this,arguments)} has no method 'clearSearch'

.

Answer 1

使用事件。

定义一个全局事件总线:

Event.Dispatcher = _.clone(Backbone.Events);

在您的分页 View 中。

View.Pagination = Marionette.ItemView.extend({
  template: paginationTpl,
  events: {
    'click .page': 'changePage'
  },
  changePage: function(e) {
    //notify page change event
    Event.Dispatcher.trigger("pageChanged", [pass any data you want to pass]);
  }
});

在您的面板 View 中，监听此事件，并定义如何处理它。

View.Panel = Marionette.ItemView.extend({
  template: panelTpl,
  events: {
    'click .search_clear': 'clearSearch',
  },
  initialize: function() {
    //listen to that event
    this.listenTo(Event.Dispatcher, 'pageChanged', this.clearSearch);
  },
  clearSearch: function() {
    //some important actions
  }
});

我对 Marionette 没有任何经验。使用 Marionette 可能有更简单的方法来实现这一点，但这是我在我的纯 Vanilla Backbone 应用程序中一直使用的模式。