dynamic component loading

Author: HarshOB

client/src/components/email.vue

@@ -2,8 +2,8 @@
   <div class="email">
     <div class="container">
           <p style="text-align: center;margin-bottom: 10px; font-size: 40px; text-decoration: underline"><b> Customer Proof</b></p>
-          <!-- {{formSchemaInstance.data}} -->
           <schemasubform v-if="!flag" :schemainstance="formSchemaInstance"></schemasubform>
+          <!-- <schemasubform v-if="!flag" :is="componentLoader"></schemasubform> -->
           <div class="row" v-if="flag">
             <div class="col-md-6">
               <div class="form-group">
@@ -59,19 +59,20 @@
   </div>
 </template>
 <script>
-import Editor from '@tinymce/tinymce-vue'
 import sendmailModal from '@/api/sendmail'
 import config from '@/config'
 import schemaModel from '@/api/schema'
-import SchemaSubForm from './SchemaSubForm'
   /*eslint-disable*/
   export default {
     name: 'email',
     computed: {
+      // componentLoader () { 
+      //   return () => import('./${this.formSchemaInstance}')
+      // }
     },
     components: {
-      'editor': Editor,
-      'schemasubform': SchemaSubForm
+      'editor': function (resolve) { require(['@tinymce/tinymce-vue'], resolve)},
+      'schemasubform': function (resolve) { require(['./SchemaSubForm'], resolve)}
     },
     props: {
     'btnArr': Object,

client/src/components/emailtemplate.vue

@@ -6,7 +6,9 @@
     </div>
     <div class="editor" v-if="newTemplate">
       <h2 class="heading">Create Template</h2>
-      <editor v-model="GetHtmlOfEditor" api-key="ppzi01crrfo3pvd43s3do89pguwkhowrwajpjdqdkginzj7k" :toolbar="toolbar1" :plugins="plugins" :init="settings" :initial-value="gethtmlcontent"></editor>
+      <keep-alive>
+        <editor v-model="GetHtmlOfEditor" api-key="ppzi01crrfo3pvd43s3do89pguwkhowrwajpjdqdkginzj7k" :toolbar="toolbar1" :plugins="plugins" :init="settings" :initial-value="gethtmlcontent"></editor>
+      </keep-alive>
       <Input v-model="templateName" placeholder="Enter Template name" style="width: 300px" class="dataEnter"/>
       <Button type="primary" @click="saveTemplate" class="dataEnter">Save Template</Button>
     </div>