Question

这是我的行为：

define(['marionette'], function (Marionette){
    'use strict';

    var Filter = Marionette.Behavior.extend({
        events: {
            'keyup @ui.filter': 'onFilter'
        },

        defaults: {
            field: "name"
        },

        onFilter: function () {
            console.log(this.options.field);
            console.log(this.view);
        }
    });

    return Filter;
});

以下是我使用它的方式

define(['underscore', 'jquery', 'marionette', 'text!components/slide-out-menu/template.html', 'eventer',
        'behaviors/behavior.filter'],
function (_, $, Marionette, templateHTML, eventer, Filter) {
    'use strict';

    var SlideOutMenuView = Marionette.LayoutView.extend({
        tagName: 'section',
        className: 'menu open',
        template: _.template(templateHTML),

        ui: {
            next: '.next',
            prev: '.prev',
            cancel: '.cancel',
            submit: '.submit',
            title: 'header h1',
            filter: 'header input',
            toggleGroups: '.toggle-groups',
            toggleSegments: '.toggle-segments'
        },

        events: {
            'click @ui.cancel': 'menuClose',
            'click @ui.submit': 'updateSelection',
            'click @ui.next': 'onNextClick',
            'click @ui.prev': 'onPrevClick',
            'click @ui.toggleGroups, @ui.toggleSegments': 'onToggleClick'
        },

        behaviors: {
            Filter: {
                behaviorClass: Filter
            }
        },

但我需要将这种行为超越成ItemView这样：

var GroupItemView = Marionette.ItemView.extend({
    tagName: 'article',

    template: _.template(templateHTML),

    ui: {
        input: 'input'
    },

    events: {
        'click': 'onSelect'
    },

    behaviors: {
        Filter: {
            behaviorClass: Filter,
            field: "group_name"
        }
    },

行为明显地从LayoutView内部触发，但是我无法在ItemView内部触发...... @ui.filter属性是LayoutView的一部分，所以也许这就是我的问题，但是如何超越ItemView？

Answer 1

不完全确定我关注，但您可以尝试从ItemView中冒泡并在布局中收听它吗？

所以在ItemView中你可以说：

triggers: 
  "click .elThatYouCareAbout": "el:clicked"

然后在你的集合/复合视图中你可以说（如果你在那里初始化它，你也可以在你的控制器中听这个）：

initialize: ->
      @on "childview:el:clicked", (child, args) =>
        @trigger "some:other:event", args

然后在您的布局中，您可以对该事件采取行动。你可能甚至不需要行为，而不是我想到它 - 我从来没有真正使用过这个模型的pub / sub / messaging到应用程序的不同部分。

（原谅coffeescript）：）

MarionetteJS并没有理解行为

1 个答案: