骨干路由器创建导致多个事件绑定到了同样的看法多个视图 [英] Backbone router creates multiple views which causes multiple events to bind to the same view

问题描述

我是新来Backbone.js的，并试图了解路线，意见等的作品，现在我有一个事件建立了同样的看法有问题。这里是一个片段会告诉你正是我的意思。 http://screencast.com/t/QIGNpeT2OUWu

I'm new to backbone.js and trying to understand how routes, views etc works and now I have a problem with events building up for the same view. here is a clip that will show you exactly what I mean. http://screencast.com/t/QIGNpeT2OUWu

这是我的骨干路由器的样子

This is how my backbone router looks like

var Router = Backbone.Router.extend({

    routes: {
        "pages": "pages",
    }
    pages: function () {
        var page_view = new PageView();
    }
});

所以，当我点击网页链接我创建了一个新的浏览量，这是code我用

So when I click the Pages link I create a new PageView and this is the code I'm using

PageView = Backbone.View.extend({
    el: $("#content"),
    initialize: function () {
        $.ajax({
            url: '/pages',
            success: function (data) {
                $("#content").html(data);
            }
        });
    },
    events: {
        "click td input[type=checkbox]": "updatePublishedStatus"
    },
    updatePublishedStatus: function (event) {
        console.log('update publish status');
    }
});

pretty基本我猜，但你可以在剪辑的每个我浏览到时候见/页，我得到注册的复选框另一个事件。

pretty basic I guess but as you can see in the clip each time I navigate to /pages I get another event registered to the checkbox.

推荐答案

有几件事情去错在这里，裸陪我一点;）

There are a few things going wrong here, bare with me for a bit ;)

1. 您的视频显示的页面是一个收集井，页。 页是一个 Backbone.Model 与属性，如页面名称，蛞蝓，出版等...你缺乏这一点，它会伤害。你不应该只是加载一些HTML并将它推到你的DOM，这违背首先利用骨干的整个目的。


2. 如果你创建一个页面模型将有一个视图。那么你的/网页的路线将展示收藏网页等的看法。


3. 您会获取你的数据不是一个视图的初始化内，而是通过做 pages.fetch（）; ，其中网页是页面的一个实例集合。这可能发生之前，你甚至初始化路由器。


4. 当改变通过您的视图属性，个别车型将被更新。

1. Your video indicates pages being a collection well, Pages. Pages being a Backbone.Model with attributes such as Page name, slug, published etc... You lack that and it's going to hurt. You shouldn't just load some html and push it to your DOM, this defies the whole purpose of using Backbone in the first place.
2. If you do create a Model for a Page it will have a View. Then your /pages route will show the view of the Collection Pages etc.
3. You will fetch your data not inside a view's initialize but rather by doing pages.fetch(); where pages is an instance of the Pages collection. This can happen before you even initialize your router.
4. When changing attributes through your view, the individual models will be updated.

作为sidepoint：初始化上获取数据不是很大。你可以调用render（），你实际上得到的数据和不好玩了。
此外，而不是做 $（'＃内容'）您可以使用视图的$埃尔。正如这$ el.html（...）;

As a sidepoint: Fetching data on initialize is not great. You can call render() before you actually get the data and that's no fun. Also instead of doing $('#content') you can use the view's $el. As in this.$el.html(...);

这篇关于骨干路由器创建导致多个事件绑定到了同样的看法多个视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！