Backbone Marionette ItemView 渲染事件不与触发器和 listenTo 一起使用答案

【问题标题】：Backbone Marionetter ItemView render event does not act with triggers and listenToBackbone Marionette ItemView 渲染事件不与触发器和 listenTo 一起使用
【发布时间】：2015-11-12 01:46:27
【问题描述】：

我正在基于backbone.Marionette 开发Rails Api，并尝试在itemview 呈现时执行jquery 代码。这是我的代码。

class Step1.Layout extends App.Views.ItemView
        template: "wizard/step1/layout"

        triggers:
            "render": "jquery:datetimepicker:runnable"
            "click .glyphicon-calendar" : "jquery:datetimepicker:runnable" ## For Test

这是控制器部分。

Step1.Controller = 

        display: ->
            view = @getStepView()

            view.on "jquery:datetimepicker:runnable", ->
                $('#due_date').datetimepicker format: 'MM/DD/YYYY'

            App.mainRegion.show view

        getStepView: ->
            new Step1.Layout

因此，“click .glyphicon-calendar”表现良好，但“render”根本不会调用控制器中的事件侦听器。我想这是因为在真实视图存在之前无法触发事件，但不确定。请注意我希望知道在itemView渲染时如何执行jquery代码，所以请告诉我它的解决方案。

【问题讨论】：

请出示@getStepView的代码

标签： jquery ruby-on-rails backbone.js render marionette

【解决方案1】：

本着@k2ndlab 答案的精神，您所要做的就是稍微更改您的controller 代码，如下所示：

Step1.Controller = 
    display: ->
        view = @getStepView()

        view.on "attach", -> // Listen to when this view's parent Region triggers 'attach'
            $('#due_date').datetimepicker format: 'MM/DD/YYYY'

        App.mainRegion.show view

事实上，triggers 用于将与视图的 DOM 交互转换为视图事件，而不是将视图事件转换为其他事件，如 docs 中所述。这就是为什么这样做

triggers:
    "attach": "jquery:datetimepicker:runnable"

对你不起作用，因为triggers 没有监听视图事件。在您的情况下，您只想知道视图何时在 DOM 中并准备好与 jQuery 交互，这就是监听 'attach' 事件的目的。

顺便说一句，建议使用onAttach 之类的@k2ndlab 事件，即，

class Step1.Layout extends App.Views.ItemView
    template: "wizard/step1/layout"

    onAttach: ->
        this.trigger 'jquery:datetimepicker:runnable'

也可以。但同样，这有点做作，因为您真正关心的是'attach' 事件。

【讨论】：

非常好的答案！！

【解决方案2】：

如果您使用的是最新版本的 Marionette，您可能希望使用附加事件而不是渲染。渲染意味着你的 html 已经生成，但并不意味着它已经在 DOM 中。另一方面，当您的视图位于 DOM 中时，会触发 on attach 事件。 datetimepicker 插件可能需要将视图附加到 DOM。

看看这两个链接：

【讨论】：

不幸的是，附加事件根本不起作用。 ;(
@SamuelJansson 尝试在 onRender 或 onAttach 回调中手动触发事件：this.trigger('jquery:datetimepicker:runnable');