title: How to use components in v-html
body: <p>I am trying to use components in v-html.
  I want to get html from own API, then I will show that.</p>
  
  <p>Here is my code.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!-- app --&gt;
  &lt;div id="app"&gt;
    &lt;span v-html="html"&gt;&lt;/span&gt;
    &lt;badge&gt;&lt;/badge&gt;
    &lt;span v-html="html2"&gt;&lt;/span&gt;
    &lt;partial name="my-partial"&gt;&lt;/partial&gt;
    &lt;span v-html="html3"&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>Vue.component('badge', {
    template: '&lt;span class="component-tag"&gt;This is component&lt;/span&gt;',
  })
  Vue.partial('my-partial', '&lt;p&gt;This is a partial!&lt;/p&gt;')
  // start app
  new Vue({
    el: '#app',
    data: {
      html: '&lt;p&gt;THIS IS HTML&lt;/p&gt;',
      html2: '&lt;badge&gt;&lt;/badge&gt;',
      html3: '&lt;partial name="my-partial"&gt;&lt;/partial&gt;'
    }
  })
  </code></pre>
  
  <p><a href="https://jsfiddle.net/9w3kz6xm/4/" rel="noreferrer">https://jsfiddle.net/9w3kz6xm/4/</a></p>
  
  <p>I tried partials because Vue document says " If you need to reuse template pieces, you should use partials."</p>
  
  <p>It does not work. Maybe I am making mistake, I don't know what is a mistake.</p>
  
  <p>Thank you.</p>