el upload sortable

엘 업로드 정렬 가능

Element UI 포토월에 드래그 조정 순서 기능 추가

타입스크립트 버전

링크

• 데모

설치하다

npm i -S el-upload-sortable

사용

 import ElUploadSortable from "el-upload-sortable" ;

export default {
  components : {
    ElUploadSortable
  } ,
  methods : {
    picUpdate ( list ) {
      // this.myList = list
    }
  }
} 

 < template >
  < el-upload-sortable @change =" picUpdate " > </ el-upload-sortable >
</ template >

타입스크립트

TypeScript를 사용하는 경우 개발을 위해 node_modules/el-upload-sortable/src/index.ts.vue 를 자신의 구성 요소 디렉터리에 직접 복사하세요.

스스로 처리해야 해

• tsconfig.json
• vue-property-designer 설치

 import { Component , Vue } from "vue-property-decorator" ;
import ElUploadSortable from "../../../node_modules/el-upload-sortable/src/index.ts.vue" ; // 这里的路径结合实际情况

@ Component ( {
  components : {
    ElUploadSortable
  }
} ) 

소품

재산	설명하다	유형	기본값
최대	업로드할 수 있는 최대 이미지 수	숫자	15
행동	이미지 업로드를 위한 API 주소	끈	https://jsonplaceholder.typicode.com/posts/
목록	초기 이미지 목록(선택사항)	정렬	[]
다수의	다중 선택 여부(선택 사항)	부울	거짓
매개변수	업로드 인터페이스에서 반환된 결과의 이미지 링크에 해당하는 필드(선택 사항) 인터페이스에서 반환된 결과가 {url: 'xxx'}인 경우 전달되는 값은 인터페이스에서 반환된 결과입니다. {result:{url:'xxx' }}인 경우 전달된 값은 "result.url"이어야 합니다.	끈	""

이벤트

재산	설명하다	콜백 매개변수
변화	포토월 데이터 업데이트 시 이벤트	(이미지 목록)