Skip to content

모달 열기

JdModalService 를 통해 컴포넌트를 열 수 있습니다. useJdModalService 를 통해 서비스를 사용할 수 있습니다.

ts
import { useJdModalService } from '@jood/v-modal';
import MyModal from './MyModal.vue';

const modalService = useJdModalService();
const onOpen = () => {
  modalService.open({
    component: MyModal
  });
};

옵션

간편하게 적용하거나 해제하기 위한 몇가지 옵션을 제공합니다.

overlayClose
floatingMode
fullHeight

모달의 css height: 100% 처리가 어렵다는 점으로 인해, 모달을 감싸는 entryComponent (부모)의 height 를 100% 로 만듭니다. 모달의 사이즈를 강제로 100% 처리하는건 아닙니다.

duration
ts
modalService.open({
  component: OpenModal,
  overlayClose: true,
  floatingMode: true,
  disableShadow: true,
  fullHeight: false,
  duration: 240
});