0

onRenderメソッド (またはitem:renderedコールバック) でいくつかの HTML 要素を操作しようとすると、失敗します。

例：

Bars.EditGallery = Backbone.Marionette.ItemView.extend
  テンプレート: 'bars/edit_gallery'
  className: '編集ギャラリー'

  onRender: ->
    # @$('select').chosen() だけ書いても動かない
    # jQuery オブジェクトには期待どおりの内容が含まれているにもかかわらず。
    ＃それを機能させるには、次のように書く必要があります：
    コールバック = -> @$('select').chosen()
    setTimeout(コールバック、0)

フィールドにフォーカスを当てるなど、他のアクションと同じです。
どのように対処しますか？のトリックはsetTimeout機能しますが、あまりエレガントではありません。

4

2 に答える 2

1

I've seen this happen when the templates used for rendering are loaded asynchronously. I thought I a pull request had fixed this in a recent release. What version of Marionette are you using?

But it looks like you're using JST, anyways, so that shouldn't be the problem. Is there anything else in your setup that is causing the render to happen asynchronously?

It seems likely that there is some asynchronous issue happening, though. Since using setTimeout fixes the problem, that makes me think the rendering is not completing before the onRender method is called.

Also - it can be hard tell if the jQuery selector is actually returning the object you want, right away. If you're using console.log to check the selector, this may be giving false results. console.log is itself asynchronous (in most browsers, anyways... not sure about all) which means the request to log the item gets queued up at the end of the event loop. It's likely that the DOM element is available by the time the logging happens.

FWIW: I use onRender for this exact purpose on a regular basis, and I've never had to use setTimeout to make it work. So my assumption is something funny going on with the rendering process, related to async stuff.

于 2012-05-14T12:56:27.057 に答える
0

この問題は、この問題で説明されているように、Chosen が原因で発生します。

于 2012-06-01T10:02:52.647 に答える