2

バックボーンにとっては比較的些細なことだと思われることを達成しようとしていますが、機能していません。ユーザーのアクションに従って、グラフにシリーズを作成しています。コードは以下です。

ユーザーが 2 つのシリーズをすばやく追加したとします。または、ルートが両方のシリーズを同時に起動します。定数は、最初のフェッチが返される前に 2 番目のフェッチが起動されることです。この場合、'fetching' は 2 回ログに記録されますが、'fetched' は 1 回しか記録されません。これは予想される動作ですか? そうでない場合、コードをどのように構成すれば動作するでしょうか?

# Series model
class Series extends Backbone.Model
    initialize: (options) ->
        _.bindAll @
        @endpoint = state?.getEndpoint()

    url: ->
        [localApiUrl, 'metrics', @endpoint, @.get('id')].join('/')



class SeriesCollection extends Backbone.Collection
    model: Series,

    initialize: ->
        _.bindAll @
        @bind 'add', @fetched

    fetchData: ( opts ) =>
        console.log('fetching')
        @series = new Series({ id: opts.id })
        @series.fetch
            success: (model, response) =>
                @.add({
                    id: @series.get('id')
                    name: @series.get('id')
                    data : @series.get('ts')
                    marker:
                        radius: 2
                    turboThreshold: 10000 
                    dataGrouping: 
                        enabled: false
                })

    fetched: () ->
        console.log('fetched', @)
4

1 に答える 1

4

複製モデルをコレクションに追加しても何も起こりません。特に、"add"何も追加されないため、イベントはトリガーされません。このことを考慮：

# c is an empty collection
c.add(id: 1, t: 'where is')
c.add(id: 2, t: 'pancakes house?')
c.add(id: 1, t: 'different')

これにより 2 つのイベントが生成され"add"、コレクションは最終的に(1, 'where is')and(2, 'pancakes house?')としてモデルになり、3 番目のイベントaddは無視されます。

デモ: http://jsfiddle.net/ambiguous/WUH6f/

0.9.2の変更ログには次のように書かれています。

  • 重複モデルをコレクションに追加するときにエラーをスローする代わりに、Backbone はそれらをサイレントにスキップするようになりました。

したがって、fetchDataが 2 回呼び出されると、 が 2 回呼び出されconsole.log('fetching')ます。ただし、opts.idへの両方の呼び出しで が同じである場合fetchData、2 番目の呼び出しは無視されます。これは、コレクションに@add既に のモデルがあるためです。id == opts.id

毎回違うとおっしゃっていますopts.idが、必ずしも違うというわけではありません@series.get('id')。AJAXのAは非同期を表すので、おそらく次のような一連のイベントが表示されることに注意してください。

  1. 何かが を呼び出しますfetchData(id: 1)。@series.id1になります。
  2. AJAX 呼び出しが行われます。
  3. 何かが を呼び出しますfetchData(id: 2)。は 2 になります。これはローカル変数ではなく、インスタンス変数@series.idであることを忘れないでください。@series
  4. サーバーは最初の AJAX 呼び出しから戻り、successハンドラーがトリガーされます。@series.idが 2 になり、Seriesfrom 3が追加されます。
  5. サーバーは 2 番目の AJAX 呼び出しから戻り、成功ハンドラーがトリガーされます。@series.idはまだ 2 なので、Seriesfrom 3が再び追加されます。ただし、これは重複するため、add無視されます。

インスタンス変数ではなく、問題のシリーズにプレーンな古いローカル変数を使用することで、これを回避できるはずです。

fetchData: ( opts ) =>
    console.log('fetching')
    series = new Series({ id: opts.id })
    series.fetch
        success: (model, response) =>
            @add(
                id: series.get('id')
                #...
            )

.インは必要ない@.addので外しました。@addまた、中かっこも必要ないため、呼び出しで中かっこを削除しました。かっこを削除することもできますが、コードのブロック構造を明確にするのに役立つことがわかったので、そのままにしました。

最初にこの問題に気付くべきでした、申し訳ありません。

于 2012-06-14T04:35:36.407 に答える