단기집중과정 101
10 모듈
5 주

파일 선택기

복사하려면 클릭

웹 애플리케이션의 Filepicker 구성 요소


새 모듈에서는 비즈니스 프로세스의 가능성을 계속 탐색할 것입니다. 간단한 수학 연산보다 복잡한 상황을 알아낼 것입니다. 비교 연산, 분기 연산, 사이클 연산에 대해 공부합니다. 또한 파일 작업 및 내용 분석 방법을 알아봅니다.

이를 위해 우리의 임무가 우리 자신의 소셜 네트워크를 개발하는 것이라고 상상해보십시오. 물론 한 번에 모두 사용자 프로필 디자인으로 충분하지는 않습니다.

전체적인 디자인

전체적인 디자인부터 시작하겠습니다. 페이지를 디자인하고 필요한 요소를 추가해야 합니다. 비슷한 문제는 이미 6번째 모듈 작업 중에 해결되었으므로 모든 단계를 다시 설명하지는 않겠습니다. 이것이 실제로 지식을 통합할 수 있는 또 다른 기회가 되도록 하십시오.

사용자가 프로필에 아바타를 추가하고 로그인을 지정하고 약력 정보도 입력할 수 있다고 상상해 보십시오. 그러나 한 가지 조건이 있습니다. 직접 입력할 수 없습니다(모든 입력 필드에는 Disabled = true 매개변수가 있음). 파일에서 로드해야 합니다.

파일 선택기

Filepicker 블록은 AppMaster 의 파일 작업에 사용할 수 있습니다. 대부분의 상황에서 유용하며 다양한 설정을 지정하고 모양을 선택할 수 있습니다. 그러나 실제로 사용하는 것 자체가 구현하려는 디자인에 적합하지 않을 수 있습니다. 따라서 이 예에서는 다른 방법을 사용하여 Filepicker 및 명시적 버튼 없이 파일을 업로드하는 기능을 만듭니다.

이를 위해 기본 컨테이너에서 Container onClick 트리거를 사용합니다. 컨테이너 또는 해당 요소를 클릭하면 이 비즈니스 프로세스가 시작됩니다. 그리고 파일을 선택하는 것부터 시작해야 합니다. 이를 위해 Select Files 블록을 사용합니다. 특이한 점은 이 블록이 실행되기 위해서는 사용자의 참여가 필요하다는 것입니다. 프로세스는 사용자가 파일을 선택한 후에만 진행됩니다. 여러 파일을 선택할 수 있도록 매개변수 Max files = 99 를 설정합니다.

계획은 사용자가 동시에 두 개의 파일을 제출하는 것입니다. 첫 번째는 아바타로 설정할 이미지입니다. 두 번째는 나머지 데이터가 포함된 Excel (xlsx) 파일입니다.

Was this article helpful?
아직도 답을 찾고 계십니까?