I have multiple complex dialog on my page, which will be very slow if loaded when page load。
How to lazy load
dialog ? like Dynamic Components
I have tried using the dialog template，but it did not work.
demo code：
```MainPage
<template>
<div>
<ejs-button @click.native="openDialog">Open Dialog</ejs-button>
<ejs-dialog
ref="dialogObj"
width='500px'
height='300px'
v-bind:visible="false"
:showCloseIcon="true"
header="My Title"
:content='templateDialog'
></ejs-dialog>
</div>
</template>
<script>
import dialogTemplate from './DialogTemplate.vue';
export default {
data: function () {
return {
templateDialog: function () {
return { template: dialogTemplate };
},
};
},
methods: {
openDialog() {
this.$refs.dialogObj.show();
},
},
};
</script>
```
```DialogTemplate
<template>
<div>
Dialog Content
</div>
</template>
<script>
//test lazy load dialog
export default {
mounted() {
console.log('DialogComponent-mounted');
},
methods: {},
};
</script>
```
What i want is , when the "mainpage" loads, the mounted method of the dialog is not called, it is called only when "openDialog" button is clicked (lazy load).
What should I do?
Looking forward to your reply. Thanks.
