ExtJs 6은 항상 ext/modern/modern/src/layout/container/Column.js를 보여준다. net :: ERR_FILE_NOT_FOUND

Question

Extjs 6.5.2를 사용하여 hello world 샘플을 시험해보고 싶다. 난 내가 발견 app.js

Ext.application({ 
    name: 'MyApp', 
    extend: 'MyApp.Application', 

    requires: [ 
     'MyApp.*', 
     'Ext.panel.Panel', 
     'Ext.layout.container.Column' 
    ] 
}); 

에서 패키지를 가져 오려고 할 경우에도

ext/modern/modern/src/layout/container/Column.js net::ERR_FILE_NOT_FOUND 

에 대해 브라우저 콘솔이 발생합니다

var containerPanel = Ext.create('Ext.panel.Panel', { 
     renderTo: 'app-div1', 
     width: 400, 
     height: 200, 
     title: 'Container Panel', 
     layout: 'column', 
     suspendLayout: true // Suspend automatic layouts while we do several different things that could trigger a layout on their own 
    }); 

    containerPanel.add({ 
     xtype: 'panel', 
     title: 'Child Panel 1', 
     height: 100, 
     columnWidth: 0.5 
    }); 

    containerPanel.add({ 
     xtype: 'panel', 
     title: 'Child Panel 2', 
     height: 100, 
     columnWidth: 0.5 
    }); 
    containerPanel.suspendLayout = false; 
    containerPanel.updateLayout(); 

다음 코드를 에러를 실행하려고하면 ext-6.5.2-trial.zip은 \ext\modern\modern\src\layout에 container 폴더를 포함하지 않았습니다.

Ext.panel.Panel 구성 요소를 사용하기 전에 어떤 단계를 놓치지 않을 수 있습니다. 감사합니다.

Answer 1

클래식의 경우 app.jsExt.panel.Panel 및 Ext.layout.container.Column에서이 2 줄을 제거해야합니다. 필요한 경우 classic보기가 필요합니다.

는 modern 툴킷에는 column 레이아웃 없으나 classic에 column 레이아웃 Ext.layout.container.Column 본있다.

이 Ext.panel.Panel에 layout:column 특성과 협력이 FIDDLE을 참조하십시오.

var containerPanel = Ext.create('Ext.panel.Panel', { 
    renderTo: Ext.getBody(), 
    width: 400, 
    height: 200, 
    title: 'Container Panel', 
    layout: 'column' 
}); 

// Suspend automatic layouts while we do several different things that could trigger a layout on their own 
containerPanel.suspendLayouts(true); //you can also use like this. 
containerPanel.add({ 
    xtype: 'panel', 
    title: 'Child Panel 1', 
    height: 100, 
    columnWidth: 0.5 
},{ 
    xtype: 'panel', 
    title: 'Child Panel 2', 
    height: 100, 
    columnWidth: 0.5 
}); 
containerPanel.resumeLayouts(true);