如何刷新其中一个视图中的其他视图的ui，它们都出现在骨干中的不同标签中？

-2

我是backbone的新手，在我目前的项目中我们使用的是Backbone和Requirejs。有4个选项卡说A，B，C，D。在标签一个我保存数据库和标签d数据的一些数据是从标签省下应该displayed.So，我打电话保存在标签手术后的标签d的渲染方法A已完成。如何刷新其中一个视图中的其他视图的ui，它们都出现在骨干中的不同标签中？

第一次加载屏幕时，所有标签都会正确加载正确的数据。但是，当我从标签一个保存数据，并调用渲染标签的方法d它不更新ui.Problem是，render()获取调用没有错误，但在用户界面选项卡d没有得到刷新。

以下是我的虚拟代码标签答：

define(['jquery','backbone','underscore','views_jira/tabDView'], 
    function($,Backbone,_,TabDView) 
    { 
     var TabAView = Backbone.View.extend({ 
      tabDView:new TabDView(), 
      render:function(){ 
       this.model.save(objectToSave,{ 
         success: _.bind(this.saveSuccessCallback, this), 
         error: _.bind(this.saveErrorCallback, this) 
        }); 
      } 
     }); 


     saveSuccessCallback: function (model, response) { 
       tabDView.render() 
     }, 

     saveErrorCallback:function (model, response) { 
     } 
    } 
);

以下为标签d代码：

define(['jquery','backbone','underscore','collections'], 
    function($,Backbone,_,DataCollection) { 
     var TabDView = Backbone.View.extend({ 
      el:'#myViewDivinHtmlBody' 
      dataCollection:new DataCollection(); 
      render:function(){ 
       this.dataCollection.fetch({ 
        success: _.bind(this.handleOpendTicketsSuccessCallback, this), 
        error: _.bind(this.handleOpendTicketsErrorCallback, this) 
       }); 
      }, 
      handleOpendTicketsSuccessCallback:function(model, response, fetchOptions){ 
       this.$el.find('.mydiv').append(response); 
      }, 
      handleOpendTicketsErrorCallback:function(model, response, fetchOptions){ 
       console.log("Error in fetching the tickets"); 
      } 

     }); 

     return TabDView; 
    } 
)

谁能告诉我在哪里，我错了。注意：没有控制台错误。

来源

2017-08-02 SRW . . .

我没有看到，增加了'TabDView'元素DOM –

您的Backbone Views需要被告知要附加到哪个DOM元素。如果您不以某种方式指定此项，那么el和$el将分配给分离的<div>标记，而不是在DOM中。因此，渲染它没有错误，但不可见。

您的视图有初始渲染成功吗？如果是这样，那么您必须将它们附加到一个DOM元素中，而这个代码不包含在您的草图中。例如：

var tabAView = new TabAView({el: '#tabA'});

或可能

tabAView.setElement('#tabA');

单程预设它为视图的所有实例创建是：

var TabAView = Backbone.View.extend({ 
    el: '#tabA', 
    // etc 
});

无论视图给出在创建时的元件或更高版本，DOM元素应该首先存在。如果选择器为空，则el将再次默认为分离的<div>。

的打孔线，当你创建你的TabAView定义中提到一个新的TabDView实例，确保它有它的参考重新描绘之前设置一个附加的DOM元素。我建议在下面的TabAView：

saveSuccessCallback: function (model, response) { 
    tabDView.setElement('#tabD'); 
    tabDView.render() 
},

来源

2017-08-02 18:16:41 arbuthnott

是任何代码实际上我错过了把我的虚拟代码，我分配埃尔到TabDView行。现在我编辑了这个问题。 –

其实你的解决方案tabDView.setElement（“#tabD”）已经工作。 –

太棒了，很高兴听到它。我学习了与Backbone的合作，当事情似乎没有奏效，但没有控制台错误时，原因通常是一个视图，其中的'el'并不是指你认为它是什么。 – arbuthnott

如何刷新其中一个视图中的其他视图的ui，它们都出现在骨干中的不同标签中？

回答

相关问题