Create component in template from data variable

Question

I have multiple components that take same props. I want to use those components in template in such a way that I don't use multiple if-else statements in my template. I created an object in my data and paired my components with string keys. Is there a way to call those components in template with that object ? My data object looks something like this:

componentMap:{
  "testComponent1":TestComponent1,
  "testComponent2":TestComponent2,
},

For example, if I give "testComponent1" as key, then in template it should use TestComponent.

tony19 · Accepted Answer · 2022-07-15 22:25:55Z

3

Use the component tag.

<component :is="componentMap['testComponent1']"></component>

See the Docs

edited Jul 15, 2022 at 22:25

tony19

140k24 gold badges281 silver badges354 bronze badges

answered Nov 19, 2021 at 12:38

Igor Moraru

7,7591 gold badge15 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Create component in template from data variable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related