vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-08 16:37:15 +00:00
Code Issues Projects Releases Packages Wiki Activity

Updated DynamicDialog documentation

Browse source
This commit is contained in:
Cagatay Civici 2023-11-02 09:28:24 +03:00
parent 03732ab3f8
commit dbac600078
11 changed files with 160 additions and 195 deletions
Download patch file Download diff file Expand all files Collapse all files

49
doc/dynamicdialog/CustomizationDoc.vue
View file

@ -1,6 +1,6 @@
<template>
<DocSectionText v-bind="$attrs">
<p>DynamicDialog uses the Dialog component internally, visit <NuxtLink to="/dialog">dialog</NuxtLink> for more information.</p>
<p>DynamicDialog uses the Dialog component internally, visit <NuxtLink to="/dialog">dialog</NuxtLink> for more information about the available props.</p>
</DocSectionText>
<DocSectionCode :code="code" hideToggleCode importCode hideCodeSandbox hideStackBlitz />
</template>
@ -11,38 +11,27 @@ export default {
return {
code: {
basic: `
import { markRaw } from 'vue';
import ProductListDemo from './ProductListDemo';
import FooterDemo from './FooterDemo';
import { useDialog } from 'primevue/usedialog';
export default {
methods:{
showProducts() {
const dialogRef = this.$dialog.open(ProductListDemo, {
props: {
header: 'Product List',
style: {
width: '50vw',
},
breakpoints:{
'960px': '75vw',
'640px': '90vw'
},
modal: true
},
templates: {
footer: markRaw(FooterDemo)
},
onClose: (options) => {
const data = options.data;
if (data) {
this.$toast.add({ severity:'info', summary: 'Info Message', detail:'Order submitted', life: 3000 });
}
}
});
const dialog = useDialog();
const showProducts = () => {
dialog.open(ProductListDemo, {
props: {
header: 'Product List',
style: {
width: '50vw',
},
breakpoints:{
'960px': '75vw',
'640px': '90vw'
},
modal: true
}
}
}`
});
}
`
}
};
}