Question

试图将我的头围绕在backbone.js上，到目前为止，我喜欢我所看到的。我有一个关于我不太了解的观点的问题。我正在创建一个演示应用程序，它使用表单输入将LI附加到UL。假装它是一个电影列表。所以我有：

AppView，我整个应用程序的视图
MovieView，电影UL中的单个LI

当您单击添加电影时，我想创建一个新的MovieView并将其附加到我的AppView中的UL。我在这里有一个小提琴：http://jsfiddle.net/nCEz2/

正在发生的事情是，每次创建新的MovieView时，不会将LI附加到UL，而是更新旧的MovieView。因此，不是每次都向UL添加新的LI，而是只添加我添加的第一个，更新到我添加的最新项目。任何想法，为什么我只得到一个MovieView，它不像我认为应该追加？

Answer 1

您的示例未按预期方式工作，因为MovieView的$el属性初始化一次，因此它始终表示MovieView的所有实例中的相同DOM对象。因此，虽然每次渲染新的MovieView时都会更改li的文本，但您始终会向li添加相同的ul，并且在您第一次添加它之后同前。

获得您期望的行为的一种方法是使用tagName属性，以便骨干网将自动为每个视图实例创建一个新的li元素。 e.g。

var MovieView = Backbone.View.extend({
    tagName: 'li',

    initialize: function () {
        _.bindAll(this, 'render');

        return this.render();
    },

    render: function () {
        $(this.el).text(this.model.get('name'));
    }
});

然后在你AppView.movieAdded方法：

movieAdded: function (newMovie) {
    var movieView = new MovieView({
        model: newMovie
    });

    $('#movieList').append(movieView.el); 
},

backbone.js app与视图的奇怪行为

1 个答案: