根据官方文档,当我做这样的事情时:
collection.fetch({update: true,remove: false})

我为每个新模型获得“添加”事件,并为每个更改的现有模型获得“更改”事件,而不删除任何内容.

为什么如果我调用静态数据源(集合的url总是返回相同的json),为每个收到的项调用add事件?

这里有一些代码(我没有渲染任何东西,我只是在调试):

<!doctype html>
<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    <a href="#refresh">Refresh</a>
    <script src="js/jquery-1.8.3.min.js"></script>
    <script src="js/underscore-min.js"></script>
    <script src="js/backbone-min.js"></script>
    <script src="js/main.js"></script>
  </body>
</html>

继承人JS

(function($){
    //Twitter Model
    ModelsTwitt = Backbone.Model.extend({});
    //Twitter Collection
    CollectionsTwitts = Backbone.Collection.extend({
        model:ModelsTwitt,initialize:function(){
            console.log('Twitter App Started');
        },url:'data/195.json'
    });
    //Twitts View
    ViewsTwitts = Backbone.View.extend({
        el:$('#twitter-list'),initialize:function(){
            _.bindAll(this,'render');
            this.collection.bind('reset',this.render);
            this.collection.bind('add',this.add);
        },render:function(){
            console.log("This is the collection",this.collection);
        },add:function(model){
            console.log("add event called",model);  
        }
    });
    //Twitter Router
    Router = Backbone.Router.extend({
        routes:{
            '':'defaultRoute',//Default list twitts route
            'refresh':'refreshView'
        },defaultRoute:function(){
            this.twitts = new CollectionsTwitts();
            new ViewsTwitts({collection:this.twitts});
            this.twitts.fetch();
        },refreshView:function(){
            this.twitts.fetch({update:true,remove:false});
        }
    });
    var appRouter = new Router();
    Backbone.history.start();
})(jQuery);

基本上,我使用defaultroute获取集合,它使用所有模型和属性正确获取.

当我点击刷新链接时,我调用了refreshView,它基本上尝试用新模型更新集合.
我不明白为什么如果响应相同,集合的所有模型都被检测为新的,触发添加?

Heres a functional link:打开控制台,即使集合相同,您也会看到在单击刷新时如何调用添加事件.

谢谢你的帮助.

解决方法

我的猜测是你的模型没有idAttribute (doc). Backbone查找的默认键是id,你的JSON条目没有,所以它无法分辨哪些模型已经存在.

尝试将您的模型更改为此(或另一个键,如果这个不是唯一的):

ModelsTwitt = Backbone.Model.extend({
  idAttribute: 'id_event'
});

javascript – 使用带有主干的fetch更新集合的更多相关文章

  1. 关于h5中的fetch方法解读(小结)

    这篇文章主要介绍了关于h5中的fetch方法解读(小结),fetch身为H5中的一个新对象,他的诞生,是为了取代ajax的存在而出现,有兴趣的可以了解一下

  2. ios – GL_APPLE_shader_framebuffer_fetch gl_lastFragData

    我该怎么做才能真正使用这个扩展?

  3. CoreData在Swift 3.0中的一点改变

    同时我们看到,在建立request的时候直接使用的是NSFetchRequest的纯构造器方式。作为代替我们使用context的另一个方法来完成:that‘sall,goodluck!;)

  4. Swift3.0 CoreData Fetch语法的一些改变

    在Swift3.0之前,我们可以这样fetch数据:不过在Swift3.0以后,要做一些调整,首先第1句修改为:在这里你必须明确指定一种泛型,在第2句修改如下:最后第3句不需要做改变.其实第1句也可以这么写:这样第3句就可以将类型转换删掉了:

  5. 如何在SWIFT中的IOS CORE-DATA请求中使用SQL GROUP BY和SUM函数?

    我有一个表(Transactions),其中包含包含Account_name和交易金额的记录.我想计算每个帐户的所有交易的总额,以“私人”开头,交易金额为>1000.我想按名称按降序排列帐户.所以sql请求会是这样的:我如何在Swift中使用Core-DATA来做到这一点.谢谢请记住,CoreData不是关系数据库,因此您应该认为实体不是“表”,对象不是“记录”.另请注意,按照惯例,属性名称不应以

  6. react中fetch之cors跨域请求的实现方法

    本篇文章主要介绍了react中fetch之cors跨域请求的实现方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. React Native使用fetch实现图片上传的示例代码

    本篇文章主要介绍了React Native使用fetch实现图片上传的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  8. 详解React native fetch遇到的坑

    这篇文章主要介绍了详解React native fetch遇到的坑,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  9. fetch跨域问题的使用详解

    这篇文章主要介绍了fetch跨域问题的使用详解,fetch 的核心主要包括:Request , Response , Header , Body,利用了请求的异步特性 --- 它是基于 promise 的,本文通过实例代码给大家介绍的非常详细,需要的朋友可以参考下

  10. JavaScript使用Fetch的方法详解

    Fetch API提供了一个JavaScript接口,用于访问和操纵HTTP管道的部分。它还提供了一个全局 fetch()方法,该方法提供了一种简单,合理的方式来跨网络异步获取资源。本文将详解JS如何使用Fetch,感兴趣的可以学习一下

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部