在 Backbone.js 的 View 中获取 JSON 数据

Question

这是我的代码。请随意告诉我我做错了什么或做对了什么。我试图将所有内容存储在 PhishVids 对象中。如果这是错误的做法，请告诉我。

我的 JSON 存储在 /shows/YEAR.json 中。年份范围为 1987 年至 2011 年。我似乎无法加载 JSON，所以有人可以指出我正确的方向吗？

var PhishVids = {
    Models: {
        Show: Backbone.Model.extend({
            defaults: {
                showid: 'show id',
                year: 'year',
                month: 'month',
                day: 'day',
                venue: 'venue'
            }
        })
    },

    Views: {
        Show: Backbone.View.extend({
            el: $('#content'),
            initialize: function() {
                this.model.fetch();
                this.model.bind('change', this.render, this);
            },
            render: function(event) {
                var compiled_template = _.template($("#shows-template").html());
                this.el.html(compiled_template(this.model.toJSON()));
                return this; //recommended as this enables calls to be chained.
            },
            events: {
                "click .show": "showClick"
            },
            showClick: function(event) {

            }
        })
    },

    Collections: {
        ShowList: Backbone.Collection.extend({
            parse: function(response) {
                return response.items;
            }
        })
    }

};

显示模板：

<script type="text/template" id="shows_template">
    <a href='/<%= year %>/<%= month %>/<%= day %>' class='show <%= month %> <%= day %>' id='<%= showid %>'><%= month %>/<%= day %></a>
    <div class='venue'><%= venue %></div>
</script>

Answer 1

我在这里可以看到一些问题。如果没有看到调用代码、JSON 示例，并且更多地了解您正在尝试执行的操作，则不可能知道您实际在执行的操作。但是，我立即注意到以下几点：

1）当您获取集合时，该集合将根据它接收到的数据（应该是对象数组）创建模型实例。它将使用 this.model 作为类型，但您尚未定义模型应该是什么.. 2 )

您的模型和集合都没有 url 或 urlRoot 成员，这将告诉他们如何获取

3) 在您的视图对象中，您的初始化函数（在对象构造完成后立即调用）引用了 this.model，该模型尚未被调用在任何地方设置，因此将是未定义的。

通常，如果您要使用类似的东西，您应该首先实例化集合（new object()），然后调用 .fetch() 来获取数据。 fetch() 可以接受成功和错误的对象作为回调，也可以返回一个 jquery 延迟对象（如果您使用的是 jquery），您可以使用 .done(..) 和 .fail(..) 来找出何时它完成了。

然后，您可以将模型作为选项（对象的一部分）传递到新的 ...View({model: model_you_want}) 等中，并使用它来渲染。

希望有帮助