【问题标题】:Backbone - Access other views of collectionBackbone - 访问集合的其他视图
【发布时间】:2014-02-04 02:32:11
【问题描述】:

我有一个典型的收藏模型结构。

在视图中,每个对象都有一个“编辑”按钮,该按钮应停用其他对象的所有“编辑”按钮。

我想知道这样做的最佳做法是什么。谢谢!!

【问题讨论】:

    标签: backbone.js backbone-views backbone-events


    【解决方案1】:

    您可以在模型上添加属性editable,默认设置为true。然后,当您单击其中一个视图上的“编辑”按钮时,您可以遍历其他视图的所有模型并将editable 设置为false。在视图上,您​​将听取模型更改并重新渲染视图。如果editablefalse,您将禁用编辑按钮。

    【讨论】:

    • 不错!!是否可以添加数据库中不存在的模型属性?怎么样?
    • 老实说,我从未将我的 Backbone 模型同步到服务器。我无法想象客户端模型不允许拥有自己的属性。您可以自定义实现 sync 方法,但这可能不是最漂亮的解决方案。
    • 也许看到这个答案:stackoverflow.com/questions/11941010/…
    【解决方案2】:

    好的,所以我想出了以下方法:

    假设模型有一个属性status,当它被修改为active时,我想在其他条目中隐藏编辑按钮(或者干脆禁用它)。

    我的集合视图监听模型的变化:

    initialize: function(){
      this.listenTo(this.collection, "change:status", this.triggerEditable);
    },
    

    监听器回调如下所示:

    triggerEditable: function(obj){
        var triggerValue = null;
    
        // I am interested in a status which became 'active' or stopped being 'active'
        if (obj.get("status") == 'active' && obj.previous("status") != 'active') {
            triggerValue = "editable:false";
        } else if (obj.get("status") != 'active' && obj.previous("status") == 'active') {
            triggerValue = "editable:true";
        }
    
        // for any other status change - return
        if (!triggerValue) return;
    
        // trigger is fired for all other objects in the collection
        _.each(obj.collection.without(obj),function(otherObj) {
            otherObj.trigger(triggerValue);
        });
    }
    

    因此,当一个对象变为活动或停止活动时,会为所有其他条目触发edidable:falseedidable:true。我需要做的就是在模型视图初始化器中添加一个监听器:

    this.listenTo(this.model, "editable:false", this.disableEdit);
    this.listenTo(this.model, "editable:true", this.enableEdit);
    

    在这里,我想我可以将这两行合并为一条,首先通过侦听 editable 命名空间(如何??),然后将参数传递给函数(再次,究竟如何?)。

    从这里开始很简单 - 实现监听器回调:

    disableEdit: function() {
        var e = this.$el.find('button.edit')
        e.attr('disabled','disabled');
    }
    

    如果有人要添加一些东西或使这个解决方案更好,我会很高兴听到。 无论如何,希望对其他人有所帮助!

    【讨论】:

      猜你喜欢
      • 2012-11-23
      • 1970-01-01
      • 1970-01-01
      • 2013-07-11
      • 2014-10-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多