Question

我遇到了一个我觉得诊断很简单的问题，但我似乎无法自行解决。

我有以下用CoffeeScript编写的缩写Backbone代码：

events = FD.Events # collection

# instantiated on page load with collection: events
class FD.StreamView extends Backbone.View

el: $(".stream")

initialize: ->
    # Bind the view to listen for a reset of the collection and rerender
    @collection.on("reset", @render)

    # Listen for a change to this model and run the function getActivities
    FD.filters.on("change", @getActivities)

render: =>
    # render function code

getActivities: =>
    # create a new instance of the FD.Events collection class
    events = new FD.Events

    # create a new instance of this view, passing in the new empty collection
    streamView = new FD.StreamView collection: events, model: FD.filters

    # make an AJAX call and as a part of the callback function, reset the collection
    # for the view we just instantiated above
    params = FD.filters.attributes
    callbackFunc = (responseText) ->
        json = $.xml2json(responseText)
        activities = json.activity
        events.reset activities
    params = FD.filters.attributes
    activities_json = $.get("/landing/Data", params, callbackFunc)

正如您可能看到的那样，问题是每次调用集合时，getActivities函数的运行次数会增加一倍，因为第一次运行它时会创建第二个视图，然后运行这两个视图。当集合发生变化时，这两个实例中的每一个都会创建两个实例，因此我们现在有四个实例，所有四个实例都运行getActivities。然后是8岁，然后是16岁。

显然，创建FD.StreamView类的新实例不是正确的方法，但我不知道如何重置单个视图所绑定的集合，以及如何触发绑定的@render功能

有什么想法吗？如果我遗漏了重要信息，请告诉我。提前谢谢。

迈克尔

Answer 1

您想要的结构是将视图的render绑定到集合的事件，就像reset和add/remove一样，具体取决于应用程序的细节。但是，getActivities应该简单地告诉集合通过fetch方法获取数据，但使用当前的过滤器集（我假设是搜索查询）。因此，在filters执行getActivities，然后只需events.filters = FD.filters，将名为events.fetch()的实例属性添加到集合类中。当响应到达时，集合将重置，这将触发将导致render()执行的事件，并且您的视图将是最新的。您在render()中创建ajax请求的代码属于集合，而不属于视图。

Backbone JS从视图功能内重置视图集合

1 个答案: