如何刷新其中一個視圖中的其他視圖的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，它們都出現在骨幹中的不同標籤中？

回答

相關問題