Extjs 초보자 강좌

Extjs 초보자 강좌

이것은 제가 아이티에서 보낸 첫 번째 블로그입니다. 목적은 제가 배운 것을 기록하는 것입니다. 만약에 다른 사람에게 도움을 줄 수 있다면 저는 영광스럽습니다. 제 수준은 매우 제한되어 있습니다. 부족한 것이 있으면 바로잡아 주십시오.
작년 말부터 extjs 버전을 접하기 시작한 것은 최신의 4.1.1이지만 이론적으로 보면 코드를 쓰지 않았고 새해에 회사에 도착한 후에 일이 없어서 예전의 업무 절차를 extjs로 바꾸기로 결정했다. 회사는 현재 미공이 없고 인터페이스는 모두 개발자가 스스로 하고 통일된 스타일도 없고 심미관도 나쁘기 때문에 다른 사람이 만든 것으로 하자.먼저 내가 사용한 후에 느낀 좋은 점을 말해 보아라.
            1. 스타일이 통일되고 대범하여 내가 지금 하고 있는 것보다 훨씬 낫다.2. extjs와 flex, swing 등은 구성 요소의 구조에 있어 모두 구성 요소를 바탕으로 개발된 것이다. 이런 구조는 창설, 렌더링, 레이아웃을 잘 관리한다. 이미 있는 구성 요소를 계승함으로써 자신이 정의한 것을 신속하게 개발할 수 있고 부류의 특유의 방법을 덮어쓰면 구성 요소의 레이아웃, 창설, 렌더링 과정에서 구성 요소에 대해 더욱 미세한 제어를 할 수 있다.만약 매우 개성화된 프로젝트가 아니라면, 일반적인 프로젝트는 완전히 쓰기에 충분하다.

시작 전 준비

준비해야 할 것은 간단하다. 두 가지다. 하나는 js 편집 도구이고 보통 eclipse이다. 그 다음에 가장 중요한 것은 extjs의api이다. 나는 공식적인api가 아주 잘했다고 생각한다. 바로 모두 영어이다. 자세히 읽어야 한다. 그리고 어떤 것은 예가 없어서 잘 알지 못하지만 초보자에게는 이미 좋은 것이다.extjs의api는 php로 썼기 때문에 사용하려면 아파치 서버를 설치해야 합니다
제 컴퓨터에는amfphp가 설치되어 있습니다. 임의의 버전으로 하면 됩니다. extjs의api를 www 디렉터리에 놓고ampphp를 실행하면 됩니다.amfphp는 하나의apache 서버와 mysql 데이터베이스를 가지고 있습니다.이 물건은 flex의amf 데이터 형식을 위해 쓴 것이다. 바로 flex가amf 데이터 형식을 사용하고 백엔드에서 데이터를 전달하는 것을 책임지는 것이다. 자바 언어도 하나의 버전이openamf이다.

간단한 예

나는 간단한 예부터 시작하는 것이 좋다고 생각한다. 공부할 때 먼저 사용하고 어느 정도 기다렸다가 원본을 본다. 처음부터 원본을 보지 말고 천 번을 보는 것이 손으로 한 번 보는 것보다 낫다.
먼저 extjs의 사용 장소를 말해 보세요. extjs는 포털 사이트에 적합하지 않습니다. extjs가 너무 커서 중국의 인터넷 속도도 빠르지 않습니다. 만약에 포털 사이트가 있으면 끝납니다. 보통 extjs의 사용 장소는 사무용 플랫폼입니다. 페이지를 하루에 닫지 않아도 되는 것입니다. 인터넷 속도가 느려도 한 번만 불러올 뿐입니다. mvc 구조를 사용하면 extjs의 불러오는 속도가 느린 문제를 개선할 수 있습니다.나는 이전의 판본을 배운 적이 없다. 인터넷에서 보면 많은 차이가 있다. 여기서 나도 다른 것과 다르다고 말하지 않는다. 흥미가 있는 인터넷에는 이런 블로그가 매우 많아서 스스로 검색하면 된다.
우선 가장 많이 사용되는 함수: Ext.create (전체 경로의 클래스 이름, {//초기화 매개 변수})new 전체 경로 클래스에 해당합니다.역할은 클래스의 실례를 만들고 변경된 실례의 인용을 되돌려주는 것이다.다음 코드를 사용하여 클래스를 만듭니다.

Ext.create("Ext.container.Viewport",{
       id:"maincontainer",
       title:"XX ",
       layout:"border",
       frame:true,
       items:[{
             region:"north",
             html:" "},{
             region:"south",
             html:" "},{
             region:"west",
             html:" "},{
             region:"east",
             html:" "},{region:"center",
             html:" "
       }]
});

실행해 보겠지만, 우선 ext-all-debug를 도입해야 합니다.js와 리소스 디렉터리 아래 css의 ext-all.css, 리소스를 넣는 게 좋겠어요.
프로젝트의 루트 디렉터리에서 위의 프로그램을 실행하면 위쪽, 아래쪽, 왼쪽, 오른쪽, 중간 디렉터리로 나뉘는 플랫폼을 볼 수 있습니다.viewport 클래스에서 만든 대상은 기본적으로 body 탭에 렌더링되어 페이지의 모든 것을 덮어씁니다.