vue+element 에서 el-table 줄 의 아래 표 시 를 가 져 옵 니 다.아래 표 시 된 배열 대상 방식 에 따라 작 동 합 니 다.
전단 코드:
scope.$index:현재 줄 의 아래 표 시 를 가 져 옵 니 다.
scope.row:현재 줄 의 대상 가 져 오기
효과 그림:
사고:이 벤트 를 클릭 하여 이 대상 을 배열 의 아래 표 시 를 방법 에 전달 한 다음 에 배열 을 조작 합 니 다.
아래 표 시 된 배열 에 대응 하 는 대상 을 삭제 할 수 있 습 니 다.
추가 지식:vue-element-uproad 파일 업로드
프로젝트 에서 파일 업로드 기능 을 사용 할 때 는 탄 상 자 를 직접 꺼 낼 수 없 으 며,먼저 두 번 확인 하거나 힌트 를 줘 야 합 니 다.선택 한 파일 탄 상 자 를 열기 전에 일련의 작업 을 할 수 있 습 니 다.
아이디어 구현 은 element-upload 구성 요 소 를 바탕 으로 단 추 를 추가 하고 트리거 단 추 를 누 른 후에 파일 을 선택 하기 전에 작업 을 하고 작업 이 끝 난 후에 upload 의 선택 파일 을 터치 합 니 다.
구체 적 인 효과:'가 져 오기'를 누 르 면 필수 옵션 을 알려 줍 니 다.
구체 적 인 실현:
1.'가 져 오기'단 추 를 새로 써 서 업로드 구성 요 소 를 위치 추적 으로 가 립 니 다.엘 레 멘 트-uproad 를 2 차 로 봉인 한 곳 입 니 다.
구성 요소 사용:
<div class="importBox">
<el-button type="primary" icon="el-icon-upload2" class="box_btn" @click="onImport"> </el-button>
<ImportExcel ref="importFile" class="box_upload"@getImportFile='getImportFile'/>
</div>
구성 요소 정의:
<template>
<el-upload
class="upload-demo"
ref="fileRefs"
:action="action"
:show-file-list="false"
:accept="acctype"
:limit="limit"
:http-request="uploadFileRes"
:before-upload="beforeAvatarUpload"
>
<el-button :loading="uploadLoading" type="primary" > </el-button>
</el-upload>
</template>
2.'가 져 오기'를 누 르 면 이벤트 가 발생 합 니 다.
// -
onImport() {
// ,
this.$refs['importFile'].$refs['fileRefs'].$refs['upload-inner'].handleClick()
this.$refs.searchForm.validate((valid) => {
if (valid) {
this.$refs['importFile'].$refs['fileRefs'].$refs['upload-inner'].handleClick()
}
})
},
3.해석:this.$refs['importFile'].$refs['fileRefs'].$refs['upload-inner'].handleClick()
ref 를 통 해 구성 요소 내 단 추 를 한 층 씩 터치 하 는 handleClick 이 벤트 를 통 해[importFile],['fileRefs']를 구분 하 십시오.그 중에서['upload-iner']는 ImportExcel 구성 요소 내부 단추 의 ref 입 니 다.
다른 ref 를 콘 솔 에 인쇄 하여 구체 적 인 내용 을 볼 수 있 습 니 다.
요약:예 시 는 파일 을 선택 하기 전의 폼 을 검사 할 뿐 자신의 수요 에 따라 서로 다른 파일 을 선택 하기 전의 처 리 를 실현 할 수 있 습 니 다.여러분 께 참고 가 되 셨 으 면 좋 겠 고 많은 응원 부 탁 드 리 겠 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Fastapi websocket 및 vue 3(Composition API)1부: FastAPI virtualenv 만들기(선택 사항) FastAPI 및 필요한 모든 것을 다음과 같이 설치하십시오. 생성main.py 파일 및 실행 - 브라우저에서 이 링크 열기http://127.0.0.1:...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.