Список Отображает данные в режиме проектирования архива Sencha, но не в Preview или Build

Question

У меня есть вид списка в контейнере, в свою очередь, на панели форм, в свою очередь, на панели вкладок с правильно настроенным прокси-сервером и json-считывателем. При просмотре в режиме проектирования Sench Architect 2 я могу видеть элементы данных и прокручивать их. Однако, когда я запускаю, часть списка экрана пустая: только поле поиска состыковано в верхней части экрана.

Я занимаюсь этим часами без каких-либо успехов, помощь будет принята с благодарностью.

Мой код выглядит следующим образом:

Ext.define('MyApp.view.MyTabPanel', { 
extend: 'Ext.tab.Panel', 
alias: 'widget.MainTab', 

config: { 
    items: [ 
     { 
      xtype: 'container', 
      title: 'Customer', 
      layout: { 
       type: 'fit' 
      }, 
      items: [ 
       { 
        xtype: 'formpanel', 
        scrollable: 'vertical', 
        items: [ 
         { 
          xtype: 'container', 
          layout: { 
           type: 'fit' 
          }, 
          items: [ 
           { 
            xtype: 'searchfield', 
            placeHolder: 'Type customer name' 
           }, 
           { 
            xtype: 'list', 
            docked: 'bottom', 
            height: 431, 
            ui: 'round', 
            itemTpl: [ 
             '<div>{Name}</div>' 
            ], 
            store: 'CustomersStore', 
            itemHeight: 25, 
            striped: true 
           } 
          ] 
         } 
        ] 
       } 
      ] 
     }, 
     { 
      xtype: 'container', 
      title: 'SKU' 
     }, 
     { 
      xtype: 'container', 
      title: 'Invoice' 
     }, 
     { 
      xtype: 'container', 
      title: 'Payment' 
     } 
    ] 
} 

});

Answer 1

Причина найденная: консоль обнаружила, что «Происхождение .... не разрешено доступом-контролем-разрешать-Происхождение», поэтому я полагаю, что мне нужно использовать JsonP.

Что остается непонятным для меня, я бегу это приложение Сенча из http://localhost/... в то время как мои сервисных точек REST для http://localhost:8080/...

Как же тогда это рассматривается как различного происхождения?

Answer 2

Причина в том, что вы взяли 2 элемента управления в контейнере с подходящей компоновкой. у вас есть 2 варианта. Вариант 1: сделать searchfield пристыкован сверху

// your code { 
     xtype: 'container', 
     layout: { 
      type: 'fit' 
     }, 
     items: [ 
      { 
        xtype: 'searchfield', 
        placeHolder: 'Type customer name', 
        docked: 'top'//Set docked top, 
      }, 
      { 
       xtype: 'list', 
       docked: 'bottom', 
       height: 431, 
       ui: 'round', 
       itemTpl: [ 
         '<div>{Name}</div>' 
       ], 
       store: 'CustomerStore', 
       itemHeight: 25, 
       striped: true 
      } 
    ]} 

Вариант 2: установка макета контейнера VBox и определить высоту списка с помощью гибкого

{ 
         xtype: 'container', 
         layout: { 
          type: 'vbox'//set layout style to vbox 
         }, 
         items: [ 
          { 
           xtype: 'searchfield', 
           placeHolder: 'Type customer name' 
          }, 
          { 
           xtype: 'list', 
           docked: 'bottom', 
           height: 431, 
           ui: 'round', 
           itemTpl: [ 
            '<div>{raceDate}</div>' 
           ], 
           store: 'MyNotes', 
           itemHeight: 25, 
           striped: true, 
           flex: 1//define height of list view 
          } 
         ] 
        }