Sencha Touch - 容器內的傳送帶

Question

我是新來的sencha touch，我嘗試創建一個容器，分爲3個部分。第二部分應該有一個旋轉木馬組件。這是我的代碼：

var con = new Ext.Container({ 
    width: '100%', 
    height: '100%', 
    layout: { 
     type: 'vbox', 
     align: 'stretch' 
    }, 
    items: [ 
    { 
     flex: 1, 
     html: 'First', 
     items: [ 
      { 
       xtype: 'carousel', 
       defaults: { 
        layout: 'hbox' 
       }, 
       items: [ 
        { 
         html: '1', 
         cls: 'card' 
        }, 
        { 
         html: '2', 
         cls: 'card' 
        } 
       ] 
      } 
     ] 
    }, 
    { 
     flex: 2, 
     html: 'Second' 
    }, 
    { 
     flex: 3, 
     html: 'Third' 
    } 
    ] 
}); 

結果顯示除了旋轉木馬之外的3個組成部分。我做錯了什麼？非常感謝。

Answer 1

幾件事情：
1 - 你不需要一個容器（第一），因爲它擴展容器
2按住轉盤 - 當您使用HTML您正在設置容器的主體，所以你添加任何成分不會出現

這應該與煎茶觸摸2（還沒有與觸摸1測試）工作：

 var con = new Ext.Container({ 
      width: '100%', 
      height: '100%', 
      layout:{ 
       type: 'vbox', 
       align: 'stretch' 
      }, 
      items:[{ 
       xtype: 'carousel', 
       defaults: { 
        layout: 'hbox' 
       }, 
       flex: 1, 
       items:[{ 
        html: '1', 
        cls: 'card' 
       },{ 
        html: '2', 
        cls: 'card' 
       }] 
      },{ 
       flex: 1, 
       html: 'Second' 
      },{ 
       flex: 1, 
       html: 'Third' 
      }] 
     });