MVC 대체하기 위한 아키텍처
MVC : 각 뷰를 통제하는 controller를 제어하기 어렵고, view와 controller가 N:N구조로 만들어지다 보면 복잡
Model과 Controller를 View에 종속적인 구조로 구성한 View기준 아키텍처.
View가 종료되면 ViewController와 ViewModel은 같이 소멸.
→ ViewModel
뷰가 보여주는 화면을 대신.
통신을 위한 데이터 레이아웃이 아니다!
→ ViewController
뷰의 이벤트나 필요한 메소드를 구현해 view와 상호 연동.
전역적인 글로벌 controller와는 달리, 자신과 연결된 View에 한하며 이벤트나 참조 등의 구현이 단순
기본 구성 만들기
cmd창에 sencha generate app -ext MemberApp ./MemberApp
cd MemberApp
sencha app watch
C:\Workspace\workspaceExtjs\MemberApp\app\view\main 경로에 Main.js 생성
Ext.define('MemberApp.view.main.Main', {
extend: 'Ext.container.Container',
xtype: 'main',
controller: 'main',
viewModel: {
type: 'main'
},
layout: 'border',
defaults: {
border: true
},
items:[{
region: 'north',
height: 50,
bodyStyle: 'background-color: black',
html: '<h2><font color="white"> 회원관리</font></h2>',
}, {
region: 'west',
title: '메뉴',
html: '메뉴',
collapsible: true,
width: 200
}, {
region: 'center',
xtype: 'tabpanel',
name: 'mainbar',
items: [
{
title: '메뉴1',
html: '컨텐트 위치'
}]
}, {
region: 'south',
height: 30,
html: '도움말',
}],
});