Closed Mini-ghost closed 1 year ago
In current, useModal usage like following code:
useModal
<script setup lang="ts"> import { markRaw } from 'vue' import { VueFinalModal, useModal } from 'vue-final-modal' const modalInstance = useModal({ component: markRaw(VueFinalModal), slots: { // pass a html string default: '<p>The content of the modal</p>', // pass a object include `component` and optional `attrs` default: { component: markRaw(CustomComponent), attrs: { // <CustomComponent />'s props } } } }) </script>
This PR improves two features:
markRaw
slots
The following code is new usage after this PR
<script setup lang="ts"> import { markRaw } from 'vue' import { VueFinalModal, useModal } from 'vue-final-modal' const modalInstance = useModal({ component: VueFinalModal, slots: { // pass a html string default: '<p>The content of the modal</p>', // pass a object include `component` and optional `attrs` default: { component: CustomComponent, attrs: { // <CustomComponent />'s props } }, // pass a component directly default: CustomComponent, } }) </script>
In current,
useModal
usage like following code:This PR improves two features:
markRaw
to wrapper component.slots
allow passing slot name and components directly.The following code is new usage after this PR