我对ext js非常陌生，有人可以告诉我的代码有什么问题

Question

它没有显示任何错误，也没有渲染任何UI。我想动态添加数字字段。

var numberField= Ext.create('Ext.form.Panel', { 
      cls: 'questionRows', 
      hidden: show, 
      itemId: item.HealthNeedsDetailsGuid, 
      id: item.HealthNeedsDetailsGuid, 
      items: [{ 
       xtype: 'field', 
       html: item_index + ') ' + item.HealthNeedsQuestion 
      }, { 
       xtype: 'numberfield', 
       anchor: '100%', 
       name: 'bottles', 
       clearIcon: false, 
       width: 400, 
       value: 99, 
       maxValue: 99, 
       minValue: 0 
      }] 
     }); 

Answer 1

在煎茶触摸，Ext.form.Panel是滚动项目，所以它不会显示，直到您指定的高度或使scrollable财产null。

要显示整个屏幕上的数字字段，您可以在Ext.form.Panel中给fullscreen:true属性。就像这样：

Ext.application({ 
 
    launch : function() { 
 
     var numberField= Ext.create('Ext.form.Panel', { 
 
     cls: 'questionRows', 
 
     fullscreen:true, 
 
     items: [{ 
 
      xtype: 'field', 
 
      html: 'Field Html here' 
 
     }, { 
 
      xtype: 'numberfield', 
 
      anchor: '100%', 
 
      name: 'bottles', 
 
      clearIcon: false, 
 
      width: 400, 
 
      value: 99, 
 
      maxValue: 99, 
 
      minValue: 0 
 
     }] 
 
    }); 
 
    } 
 
});

<link rel="stylesheet" href="https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css"> 
 
<script type="text/javascript" src="https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all-debug.js"></script>

OR

将其添加到现有的组件调用add()从现有组件，并给numberField作为参数mainPanel.add(numberField);。 在numberField要么给height财产或scrollable:null财产Ext.form.Panel。就像这样：

Ext.application({ 
 
    launch : function() { 
 
     var numberField= Ext.create('Ext.form.Panel', { 
 
     cls: 'questionRows', 
 
     height:344, 
 
     items: [{ 
 
      xtype: 'field', 
 
      html: 'Field Html here' 
 
     }, { 
 
      xtype: 'numberfield', 
 
      anchor: '100%', 
 
      name: 'bottles', 
 
      clearIcon: false, 
 
      width: 400, 
 
      value: 99, 
 
      maxValue: 99, 
 
      minValue: 0 
 
     }] 
 
    }); 
 
//this is the Panel we'll be adding to 
 
var mainPanel = Ext.create('Ext.Panel', { 
 
fullscreen: true, 
 
items: { 
 
    html: 'Main Panel' 
 
} 
 
}); 
 
//now we add the numberField inside the main panel 
 
mainPanel.add(numberField); 
 
    } 
 
});

<link rel="stylesheet" href="https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css"> 
 
<script type="text/javascript" src="https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all-debug.js"> 
 
</script>