url vs urlRoot有什么区别

Question

我想知道使用url或有什么区别urlRoot.我已经阅读了文档(backbonejs.org/#Model-url),但我仍然觉得我缺乏这方面的知识,我想知道更多.你什么时候用url？而在另一个例子中你何时必须使用urlRoot？

Answer 1

.urlRoot仅在模型中可用,并且仅在模型不是集合的一部分时,或者当您要覆盖该.url模型所属的集合的属性时才有用.

换句话说,当模型是具有属性集的集合的一部分时,模型既不需要.url也不需要属性,在这种情况下,该模型将使用该集合作为它自己的集合..urlRoot.url.url.urlRoot

以下是几个显示差异的示例.运行脚本时,可以在浏览器的网络面板中看到http请求.

示例1. Post不是集合的一部分.urlRoot定义url的基本部分.获取模型时,它的id附加到urlRoot.

var Post = Backbone.Model.extend({
  urlRoot: 'http://jsonplaceholder.typicode.com/posts'
});

var secondPost = new Post({ id: 2 });
secondPost.fetch();
/*requests http://jsonplaceholder.typicode.com/posts/2 */

<script src='http://code.jquery.com/jquery.js'></script>
<script src='http://underscorejs.org/underscore.js'></script>
<script src='http://backbonejs.org/backbone.js'></script>

示例2.对作为集合一部分的模型调用fetch使用集合url作为urlRoot

var Post = Backbone.Model.extend();
var Posts = Backbone.Collection.extend({
  url: 'http://jsonplaceholder.typicode.com/posts',
  model: Post
});

var posts = new Posts();
posts.add({id: 2});
posts.first().fetch();
/*requests http://jsonplaceholder.typicode.com/posts/2 */

<script src='http://code.jquery.com/jquery.js'></script>
<script src='http://underscorejs.org/underscore.js'></script>
<script src='http://backbonejs.org/backbone.js'></script>

示例3. url在模型上设置将逐字地将该url用于任何模型实例.

var Post = Backbone.Model.extend({
  url: 'http://jsonplaceholder.typicode.com/posts'
});
var secondPost = new Post({ id: 2 });
secondPost.fetch();
/*requests http://jsonplaceholder.typicode.com/posts */

<script src='http://code.jquery.com/jquery.js'></script>
<script src='http://underscorejs.org/underscore.js'></script>
<script src='http://backbonejs.org/backbone.js'></script>

例4. url可以是一个函数,它又开始有意义了.

var Post = Backbone.Model.extend({
  url: function(){
    return 'http://jsonplaceholder.typicode.com/posts/' + this.get('slug');
  }
});
var secondPost = new Post({ slug: 2 });
secondPost.fetch();
/*requests http://jsonplaceholder.typicode.com/posts/2 */

<script src='http://code.jquery.com/jquery.js'></script>
<script src='http://underscorejs.org/underscore.js'></script>
<script src='http://backbonejs.org/backbone.js'></script>