更新

Question

我有以下ItemView包含在CollectionView：

中

define(deps, function($, _, Backbone, CountriesTemplate, Globals) {
  return Backbone.Marionette.CollectionView.extend({
    tagName: 'ul',
    className: 'unstyled countries',
    itemView: Backbone.Marionette.ItemView.extend({

      tagName: 'li',
      template: CountriesTemplate,

      events: {
        'change': 'toggleState'
      },

      triggers: {
        'click': 'toggleState'
      },

      toggleState: function() {
        var index = Globals.defaultCountries.indexOf(this.model.id);
        index === -1 ? Globals.defaultCountries.push(this.model.id) : Globals.defaultCountries.splice(index, 1);
        this.model.set('checked', !this.model.get('checked'));
      }
    })
  });
});

该集合绑定到一个复选框列表，并手动绑定到代表国家/地区的svg圈元素。选中/取消选中复选框不是问题，并按原样调用toggleState。在单击svg圈元素时尝试手动触发事件时会出现问题。

尝试手动触发点击事件的代码：

// country is a "model"
checkbox.prop('checked', true);
// Changes the checked attribute but does not call toggleState.        
country.set('checked', true); 
// Nothing happens here.
country.trigger('click');

那么，手动调用toggleState的正确方法是什么？

更新

使用damienc88的答案，我在itemView中进行了以下更改，以使触发器正常工作。

itemView: Backbone.Marionette.ItemView.extend({
  tagName: 'li',
  template: CountriesTemplate,

  events: {
    'change': 'toggleState'
  },

  initialize: function() {
    this.listenTo(this.model, 'toggleState', this.toggleState);
  },

  toggleState: function() {
    // Code.
  }
})

现在可以从外部呼叫model.trigger('toggleState')。

Answer 1

如果您尝试直接在ItemView上调用toggleState，则只需调用itemView.toggleState();这仅在您有权访问该特定itemView对象时才有效。你可能不知道。

或者，您可以在模型上触发事件，并且ItemView可以在其模型上侦听该事件：

this.listenTo(this.model,'toggleState',this.toggleState)。然后，您的CollectionView需要致电model.trigger('toggleState')。

如何手动调用ItemView函数？

更新

1 个答案: