Skip to content

Instantly share code, notes, and snippets.

@afontcu
Last active July 7, 2020 12:11
Show Gist options
  • Save afontcu/6f28cd11f942504793f2a524b3e54a7a to your computer and use it in GitHub Desktop.
Save afontcu/6f28cd11f942504793f2a524b3e54a7a to your computer and use it in GitHub Desktop.
<template>
<div>
<component :is="componentInstance" />
</div>
</template>
<script>
export default {
props: {
isCompany: { type: Boolean, default: false },
},
computed: {
componentInstance () {
const name = this.isCompany ? 'CompanyInfo' : 'UserInfo'
return () => import(`./components/${name}`)
}
}
}
</script>
@rolexta
Copy link

rolexta commented Jul 7, 2020

What if we need to render multiple component by data?
"components": [
{
"componentName": "mainBanner",
"componentPath": ""
},
{
"componentName": "OurServices",
"componentPath": "/home"
}
]

@afontcu
Copy link
Author

afontcu commented Jul 7, 2020

Hi! Then you might want to iterate on that components array, but the idea remains the same!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment