How to add dynamic components/partials in Vue.js

Question

I need to add child components dynamically to a component based on user interaction. I looked to some old issue but it seems like a dirty hack to me, besides, it is an old issue

Answer 1

You want to put the custom components there right from the start, and use v-if or v-for to show, hide, add, or subtract these components. You let the data drive the DOM, not managing the DOM yourself. Fiddle example: https://jsfiddle.net/f5n5z5oo/2/

You can even make the components dynamically change what type of component they are using is:

data: {
  elements: [
    { type: 'component-a' },
    { type: 'component-b' }
  ]
}

If you're more specific about your use case I will try to help further!