javascript - 主干 : Getting JSON file from server, 使用扩展 ".json"或不使用它，带有 url 或 urlRoot

Question

我正在做一些练习来熟悉 Backbone。我正在尝试使用 Model 的 urlRoot 属性从我的服务器获取 JSON 文件。

当我输入 urlRoot: "./js/json/todo" 时，我收到错误 (404)，提示找不到文件，但如果我这样输入 urlRoot: "./js/json/todo.json" 然后它找到了它，但是 console.log(todoItem.get('description')) 说 未定义。

现在，在我见过的许多 Backbone 应用程序中，大多数时候都没有应用扩展名 .json，即 urlRool: "/todos" 就足够了而不是 urlRoot: "/todos.json"。但是当我在没有扩展的情况下执行此操作时，我会收到错误。

• 有人可以向我解释一下如何正确使用 url 和 urlRoot 属性吗？
• 此外，不使用 .json 或使用它会出现什么问题？
• 最后，下面的 JSON 文件格式适合 Backbone 吗？

主干:

(function(window, $, Backbone) {
    var TodoItem = Backbone.Model.extend({ urlRoot: './js/json/todos' });

    var todoItem = new TodoItem({id: 1});

    todoItem.fetch();

    console.log(todoItem.get('description')); // This is undefined in the console

}(window, jQuery, Backbone));

JSON:

{
    "todos": [
    {
        "description": "Pick Up Milk",
        "status": "incomplete"
    },

    {
        "description": "Do shopping at Market",
        "status": "incomplete"
    }]
}

Answer 1

您会看到它没有 .json，因为有人使用的后端从没有 .json 的 URL 返回 JSON。当我有一个静态 JSON 文件时，我只需向其中添加 .json 即可。

这都是关于服务器设置或任何您处理网址的内容。

就您的格式而言，您不需要包装 {}。它可以只是:

[{
    "description": "Pick Up Milk",
    "status": "incomplete"
},

{
    "description": "Do shopping at Market",
    "status": "incomplete"
}]

所以，当使用静态 JSON 文件时，我的 GET 需要更多的手动操作:

$.ajax("./js/json/todo.json").done(function(data) {
    // I'm only using extend to add in the id. You could just use data[0]
    var todoItem = new ToDoItem(_.extend(data[0], { id: 1 }));
}

Fetch 并不会真正起作用，因为您的 JSON 文件是一个集合。您可以创建:

var ToDoCollection = Backbone.Collection.extend({
    model: ToDoItem,
    url: "./js/json/todo.json"
});
var toDos = new ToDoCollection();
toDos.fetch();

这将为您提供一个集合，其中包含 JSON 文件中每个条目的模型。