체인 호출 다시 인터페이스를 확인하는 방법에 JS 전면 VUE 프로젝트

에서 여러 번 호출 동일한 인터페이스 루프 어떻게 동기 실행 점진적 구현을 보장한다.

HTML部分

 < DcFileUpload 
 V - 대 = "fileLengthList의 (항목, 인덱스)" 
 : 키 = "인덱스" 
 REF = "fileUploadData"> 
</ DcFileUpload>

DcFileIliad 구성 요소 부품

사용자가 소켓의 기능과 유사한 구성 요소가 될 수있는 노드를 추가 할 필요가있는 경우 // 슬롯 탭, 다른 구덩이에 남아

<템플릿> 
<div> 
    <div 클래스 = "폼 단위 형태 업로드"스타일 = "디스플레이 인라인 블록"> 
        < 입력 
            V -Model = 'FILENAME " 
            클래스 ="TC-15 입력 텍스트 m " 
            중지 
            : 틀 = "자리"/> 
        <a class="tc-upload-btn" title="选择文件"> 
            <div 클래스 = "파일 입력 랩"> 
                < 입력 
                    REF = "입력" 
                    타입 = "파일" 
                    이름 = "파일"
                    : 동의 "동의"= 
                    스타일 = "Z- 인덱스 : 999"
                    @change = "handleFileChange"/> 
                <SPAN>选择文件</ SPAN> 
            </ div> 
        </a>를 
        <슬롯> </ 슬롯> 
    </ div>    
</ div> 
</ 서식> 

<script> 
수입 {mapActions }에서 'vuex' ; 
에서 가져 오기 DcUploadHelper '@ / 일반 / 유틸 / dcUploadHelper' ; 

수출 기본 { 
    소품 : { 
        directoryId : { 
            유형 : 문자열, 
            기본값 : '' , 
        }, 
        동의 : { 
            유형 : 문자열을,
            
        자리 표시 자 : { 
            유형 : 문자열 
            기본 : '还未选择文件' , 
        }, 
    }, 
    데이터 () { 
        반환 { 
            파일 이름 : '', // 文件名
            파일 : [],
         }; 
    } 
    방법 { 
        ... mapActions ( "알고리즘" , [
             'CreateUploadJob' 
        ), 
        handleFileChange (E) { 
            CONST 파일 {} = e.target;
            경우 (파일 [0] && 파일 [0] .name을 && 파일 [0] 크기는> 0 ) {
                 이파일 .FileName = [0 ] .name과,
                 이 본 .files = 파일; 
            } 다른 {
                 이 본 .FileName = "" ;
                 이 본 .files = 널 ; 
            } 
        } 
        handleFileDelete () { 
            이 본 .FileName = "" ;
             이 본 .files = [] 
        }, 
        업로드 () { 
            돌아가  새로운 새 =>) 거부 약속을 (비동기 (결의 { 
　　　　　　　　　　　　총칭하여 기록 요청 방법은, 백그라운드로 데이터 요청 전송한다
　　　　　　　　　　　　(상태) 결의 또는 ) (상태 거부;
                }); 
            }); 
        } 
        인 cancelUpload는 () { 
            이 .showUploadModel는 = 거짓 ; 
            DcUploadHelper.stopChunkUpload (); 
        }, 
        hasFile는 () { 
            반환  이 .fileName를 == ''! ; 
        } 
    } 
}; 
</ script> 

<스타일 LANG = "덜"> 
</ 스타일>

위의 작성된 코드는 배열 심판을 사용하는 방법을하는 심판은 일반적으로 쓰기 표준을 눌러 읽을 수있는 사이클 노드 배열을 통해 획득 할 수있는 객체에 직접 객체

JS 부분 
비동기 handleSubmitForm () { 
    // 객체의 대응하는 배열을 얻을 
　　에서 const} = {fileUploadData 이 본 $의 심판 ;.
　　대 (송출 인덱스 = 0, 인덱스 ++; 인덱스 <fileUploadData.length {) 
　　　　요소 CONST = fileUploadData [인덱스] 
　　　　CONST RET = AWAIT element.upload (); 
　　　　cosnole.log (RET); 
　　} 
}

비동기와 동일한 인터페이스를 여러 번 호출이 호출 체인을 누르면 그 위의 코드 보장하지만 기다리고, 다시 데이터 패킷 후 다음 호출의 마지막 인터페이스 요청

체인 호출 다시 인터페이스를 확인하는 방법에 JS 전면 VUE 프로젝트

추천