JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>
<div id="app">
  <div class="left">
  Component
    <div v-for="thing in stuff">
      <unknown-html :html="thing.html"></unknown-html>
    </div>
  </div>
    <div class="left">
  V-html
    <div v-for="thing in stuff">
      <unknown-html  v-html="thing.html"></unknown-html>
    </div>
  </div>
</div>

CSS

.left {
  float: left;
  margin-left: 10px;
}

JavaScript

Vue.component('unknown-html', {
  props: {
    html: ""
  },
  template: '<div><div v-html="html"></div>'
})

var app = new Vue({
  el: '#app',
  data: {
    numInputs: 1,
    stuff: [{
      'html':'<input />'
    }, {
      'html':'<button>Foo</button>'
    }]
  }
})

setInterval(() => {
  var html = {'html' : '<input />'};
  app.stuff.push(html);
  app.stuff.pop();
}, 2000)