Ext.view.View是否支持autoScroll配置選項？

Question

我一直無法添加滾動條到兩個視圖，我用分機顯示。每個視圖都是基本視圖的擴展，並且基數爲autoScroll: true。我已驗證這些元素已正確分配了overflow: auto屬性。

我已經做了一些搜索，發現this question，並在應用它的解決方案後（即使我沒有使用這個'vbox'佈局），它並沒有解決我的問題。

這是基礎的觀點：

Ext.define('Our.extensions.baseList', { 
    extend: 'Ext.view.View', 
    itemSelector: 'div.postContainer', 
    autoScroll: true, 

    initComponent: function(){ 
     this.tpl = new Ext.XTemplate(   
      '<tpl for=".">', 
       '<div name="postContainer" class="postContainer">', 
        // Contains Layout for posts 
       '</div>',  

      { // can run internal functions within a template 
       createButton: function(idPost){ 
        // Creates layout for buttons and returns it 
       } 
      } 
     ); 

     this.callParent(arguments); 
    } 
}); 

而且，這兩個孩子的觀點是：

Ext.define('Our.view.post.convList', { 
    extend: 'Our.extensions.baseList', 
    alias : 'widget.convList', 
    emptyText: 'No Conversation Followed', 
    title: 'Coversations', 

    initComponent: function(){  
     this.store = new Ext.create('Ext.data.Store', { 
      id:'convStore', 
      model: 'Our.model.Post', 
      data: [] 
     });  

     this.callParent(arguments); 
    } 
}); 

和：

Ext.define('Our.view.post.postList', { 
    extend: 'Our.extensions.baseList', 
    alias : 'widget.postList', 
    emptyText: 'No Posts', 
    title: 'Posts' 
}); 

最後，我的問題是不Ext.view.View實際上支持的是autoScroll配置屬性（或者它只是忽略它，因爲它似乎），whi ch在Sencha文檔中列爲一個有效的配置屬性。我知道它不支持layout配置，因此爲什麼鏈接問題解決方案無法正常工作。如果它支持它，我將如何去滾動條顯示出來？

編輯

有些事情我已經在我試圖拿出一個解決方案發現，在查看自己設置大小的作品，只要大小是硬編碼（像素集數） 。比如添加配置：height: 500,或者帶有height: 500px;的CSS類，但是通過CSS類的百分比大小根本不起作用 - 它們甚至沒有組件大小。

第二個編輯

正如我在註釋中規定的第一個答案好評，該組件是越來越大小1063（一個值得注意的是，發展環境是1080×1920顯示器上（縱向），並與JavaScript控制檯在Chrome中運行它的可見幀的高度1063像素。通過「可見的」我的意思是postPanel的View s的被加入。

我找到了一個臨時的解決方案，可惜我不知道認爲它是實際產品發佈的理想選擇 - 我是你請唱的refresh，以將組件的高度設置爲面板高度爲postPanel（其設置與接收的高度相同）的高度，這似乎強制它應用滾動條。我還爲postPanel的resize事件增加了一個聽衆，該事件觸發了兩個View的refresh事件。

增加...

孩子的觀點：

listeners: { 
    refresh: function() { 
     var parent = this.up('postPanel'); 
     if (parent != undefined) { 
      this.setSize({ 
       width: undefined, 
       height: parent.getHeight() 
      }); 
     } 
    } 
} 

，並在postPanel：

listeners: { 
    resize: function() { 
     var postList = this.down('postList'); 

     if (postList != undefined) { 
      try { 
       postList.fireEvent('refresh'); 
      } catch(e) { /* ignored */ } 
     } 

     var convList = this.down('convList'); 

     if (convList != undefined) { 
      try { 
       convList.fireEvent('refresh'); 
      } catch(e) { /* ignored */ } 
     } 
    } 
} 

主要的原因，我覺得這不是一個理想的解決方案是，它打破的意見自動調整大小的一半父寬度（並在refresh事件中設置this.setSize()調用中的寬度爲parent.getWidth()/2並不會改變大小，即使父級調整大小也是如此。除此之外，我不確定此w生病加上任何開銷較慢的電腦或不。

Answer 1

因此，只要組件知道它應該適合的框的大小，autoScroll就應該工作。如果您不想設置特定的框大小，請嘗試將視圖組件放入具有適合佈局的視口中。然後，視口將決定框的大小，並且您的視圖應該開始在分配的空間中滾動。該主體用於所有容器 - 有些人必須指定盒子的大小。視口是默認情況下計算出全屏大小的神奇組件。

Answer 2

嘗試將您的每個視圖放在一個容器中，並使用layout: 'fix'。然後，當內容需要時，視圖的autoScroll: true將強制滾動條。