element dialog2

요소-대화상자2

중첩하여 사용할 수 있는 요소 대화 상자의 확장

• 의존
  요소 UI

버전

• 0.0.5
  open 및 close 이벤트는 반복적으로 $emited 되지 않습니다.
• 0.0.4
  현재 [email protected]+와 [email protected]+가 올바르게 작동합니다.

사용법

• 설치하다

  npm install element-dialog2 --save

• 사용

   //common 
  var ElDialog2 = require ( 'element-dialog2' ) ;
  Vue . component ( ElDialog2 . name , ElDialog2 ) ;
  //import form source
  import ElDialog2 from 'element-dialog2/src/index.js' ;
  Vue . component ( ElDialog2 . name , ElDialog2 )

• 암호

   < el-dialog2 title =" this is title "  v-if =" showed " v-model =" showed "
      v-on:close =" handleClose " >
      < span > code of $slots.default </ span >
      < div slot =" footer " >
          code of $slots.footer
      </ div >
  </ el-dialog2 > 

   < el-dialog2   v-if =" showed " v-model =" showed "
      v-on:close =" handleClose " >
      < div slot =" title " >
          this is title
      </ div >
      < span > code of $slots.default </ span >
      < div slot =" footer " >
          code of $slots.footer
      </ div >
  </ el-dialog2 >

속성

기인하다	요소 비교	설명	유형	허용되는 값	기본
제목	같은	대화 제목. 명명된 슬롯으로 전달될 수도 있습니다(다음 표 참조).	끈	—	—
크기	같은	대화상자 크기	끈	작은/작은/큰/가득한	작은
맨 위	같은	대화상자 CSS top 의 값, size full 않을 때 작동	끈	—	15%
모달	같은	마스크 표시 여부	부울	—	진실
모달-본문에 추가	같은	본문 요소에 모달을 추가할지 여부입니다. false인 경우 모달이 대화 상자의 상위 요소에 추가됩니다.	부울	—	진실
잠금 스크롤	같은	Dialog가 표시되는 동안 본문 스크롤이 비활성화되는지 여부	부울	—	진실
맞춤형 클래스	같은	대화 상자의 사용자 정의 클래스 이름	끈	—	—
클릭 시 닫기 모달	기본값이 다름	마스크를 클릭하여 대화 상자를 닫을 수 있는지 여부	부울	—	false
닫기-누르기-탈출	같은	ESC를 눌러 대화 상자를 닫을 수 있는지 여부	부울	—	진실
쇼 클로즈	같은	닫기 버튼을 표시할지 여부	부울	—	진실
마감 전	같은	전에닫다(닫다)	기능	—	null

• [email protected]+ 의 beforeClose 새 항목

      beforeClose ( close ) {
          if ( ... ) {
              // hook of close
              close ( ) ;
          }
      }

슬롯

이름	설명
—	대화 내용
제목	대화 제목 내용
보행인	대화상자 바닥글의 내용