Question

我正在研究Marionette.behavior。我试图在视图初始化时动态传递行为哈希，但它没有被分配给视图的行为对象。因为行为在视图构建时被初始化。所以我们通过以下方式实现了解决方案，但它是实现它的正确方法吗？有没有其他方法可以实现？和为什么不允许行为动态传递？

以下是代码：

var Behaviour = new Marionette.Application();

Behaviour.addRegions({
    mainRegion:"#main-region"
});


var Person = Backbone.Model.extend({
       defaults:{
         firstName:"NA",
         lastName:"NA",
        phoneNumber:"NA",
        presentAddr:"NA",
        permanantAddr:"NA"
    }
});


var buttonView=Marionette.ItemView.extend({

template:"#buttontemplate",


 constructor:function(options){


     this.behaviors = options.behaviors;
     Marionette.ItemView.apply(this, arguments);

 },


events:{

    "click .display":"displayDetail"
 },

 displayDetail:function(){

     this.triggerMethod("DisplayPersonDetails");

},

//behaviors:{Behavior1:{ },Behavior2:{ }}
})


var PersonDetailsView = Marionette.ItemView.extend({

template:"#static-template",

ui: {
"Change": ".change"
},

events:{

"click @ui.Change":"changeBehavior"
},

 changeBehavior:function(){

},

});

var Behavior1 = Marionette.Behavior.extend({

    onDisplayPersonDetails:function(){

    var person=new      Person({firstName:"abhijeet",lastName:"avhad",phoneNumber:"9604074690",permanantAddr:"sangamner",presentAddr:""})
    var myView = new PersonDetailsView({model:person});
    Behaviour.mainRegion.show(myView);

    }

});

var Behavior2 = Marionette.Behavior.extend({

    onDisplayPersonDetails:function(){


    var person =new Person({firstName:"abhijeet",lastName:"avhad",phoneNumber:"9604074690",permanantAddr:"",presentAddr:"shivajinagar"})
    var myView =new PersonDetailsView({model:person});
    Behaviour.mainRegion.show(myView);


    }

});


Behaviour.on("initialize:after", function(){

    console.log(" started!");

        Marionette.Behaviors.behaviorsLookup = function() {
         return window.Behaviors;
    };  


    window.Behaviors = {};

        window.Behaviors.Behavior1 = Behavior1;
        window.Behaviors.Behavior2 = Behavior2; 

    var buttonview=new buttonView({behaviors:{Behavior1:{ },Behavior2:{}}});
        Behaviour.mainRegion.show(buttonview);  

});
Behaviour.start();

Answer 1

实现这一目标的另一种方法是在你的定义中声明一个函数，它返回初始化时提供的行为，如下所示：

var buttonView=Marionette.ItemView.extend({
    ...
    behaviors: function () {
        return this.options.behaviors;
    },
    ...

Answer 2

这是因为木偶在构造函数中应用了行为：

if (_.isObject(this.behaviors)) {
      new Marionette.Behaviors(this);
}

您可以尝试在初始化方法中执行相同的操作，但如果您事先已经分配了某些行为，我不确定它是否能正常工作。

Answer 3

在浏览源代码后，我想出了以下内容。它破坏了封装，这使我相信可能有更好的方法。尽管如此，直到我发现它，这将直接投入生产。

// Define Behavior.
var Behavior1 = { /* Behavior definition */ }

// Create View like normal.
var view = new ItemView({
    behaviors: {
        behavior1: { behaviorClass: Behavior1 }
    }
});

// Here's the ugly part.
view.undelegateEvents();
view._behaviors = Marionette.Behaviors(subview);
view.delegateEvents();

执行此操作后，您的行为应该都能正常工作。

Answer 4

行为可以在行为声明中直接使用behaviorClass属性传递：

如marionette.behaviors docs所示，我们有Tooltip行为，我们希望直接传递而不是从全局列表传递。

define(['marionette', 'lib/tooltip'], function(Marionette, Tooltip) {
  var View = Marionette.ItemView.extend({
     behaviors: {
        Tooltip: {
          behaviorClass: Tooltip, // <-- passing the behavior directly here
          message: "hello world"
        }
     }
  });
});

为什么不允许行为动态传递？

4 个答案: