如何实施Sencha Picker

Question

请任何人都可以帮我实施Sencha 2 KitchenSink中看到的Sencha Picker。 即/例子/的KitchenSink /＃演示/覆盖

我不断收到这个错误...

02-15 13：41：38.879：E/Web控制台（285）：试图创建一个组件在不确定的翻译：：：尚未注册的的xtype 0

这里是我的代码片段

MrFantastic.views.faith = new Ext.Panel({ 
     id:'faith', 
     title:'Faith', 
     scroll:'vertical', 
     style:'background-color:#ffffff', 
     items: [ 

       { 
        xtype: 'fieldset', 
        layout: { 
         align: 'stretch', 
         type: 'vbox' 
        }, 
        defaults:{ 
         xtype: 'radiofield', 
         flex: 1, 
         labelWidth:'85%' 
        }, 
        items: [ 
         { 
          label: 'Intolerable', 
          name:'mode' 
         }, 
         { 
          label: 'Tolerable', 
          name:'mode' 
         }, 
         { 
          label: 'Compatible', 
          name:'mode' 
         }, 
         { 
          label: 'Admirable', 
          name:'mode' 
         } 
        ] 
       } 
      ], 
      dockedItems: [ 
          { 
           dock:'top', 
           cls:"faith", 
           width:'100%', 
           height:'50%' 
          }, 
          { 
           html:'<div class="text_pane"><h3>faith <span>{noun} {feyth}</span>:</h3><ol><li>belief in God or in the doctrines or teachings of religion</li><li>a system of religious belief</li><li>a strong belief in a supernatural power or powers</li></ol><!--<span>If you ask almost any lady what kind of man she wants for a husband, she is likely to say to you, "I want a God fearing man." This probably because she believes that a God feating man will be more faithful and truthful.</span>--></div>' 
          }, 
          { 
           xtype: 'toolbar', 
           dock: 'bottom', 
           items: [ 
            { 
             xtype: 'button', 
             itemId: 'Previous', 
             ui:'back', 
             text: 'Previous', 
             handler: function() { 
              MrFantastic.views.viewport.setActiveItem('mrf_home', { type: 'slide', direction: 'right' }); 
             } 
            }, 
            { 
             xtype: 'spacer' 
            }, 
            { 
             xtype:'button', 
             text: 'Score Him', 
             handler: function() { 
              if(!this.picker) 
              { 
               this.picker = Ext.create('Ext.Picker',{ 
                slots:[ 
                 { 
                  name:'compat', 
                  title:'Compatibility Score', 
                  data:[ 
                    {text:'Intolerable', value:1}, 
                    {text:'Tolerable', value:2}, 
                    {text:'Compatible', value:3}, 
                    {text:'Intolerable', value:4} 
                    ] 
                 } 
                 ] 
               }); 
              } 
              this.picker.show(); 
             } 
            }, 
            { 
             xtype: 'spacer' 
            }, 
            { 
             xtype: 'button', 
             text: 'Next', 
             ui:'foward', 
             handler: function() { 
              MrFantastic.views.viewport.setActiveItem('family', { type: 'slide', direction: 'left' }); 
             } 
            } 
           ] 
          } 
         ] 
    }); 

请帮助我。谢谢。

Answer 1

将这个代码在handler: function()

if(!this.picker){ 
    this.picker = new Ext.Picker({ 
     slots: [ 
      { 
       name : 'compat', 
       title: 'Compatibility Score', 
       data : [ 
        {text: 'Intolerable', value: 1}, 
        {text: 'Tolerable', value: 2}, 
        {text: 'Compatible', value: 3}, 
        {text: 'Intolerable', value: 4} 
       ] 
      } 
     ] 
    }); 
} 
    this.picker.show();