title: Pass component as prop in Vue JS
body: <p><em><strong>Intro</strong></em>: I am exploring <strong>Vue Js</strong> and got stuck while trying to make a <strong>dynamic data table</strong> component the problem I am facing is that I cannot pass a component via props and render it inside a table.</p>
  <p><em><strong>Problem</strong></em>: So basically what I am trying to do is to pass some custom component from headers prop in <strong>v-data-table</strong> such as:</p>
  <pre><code>headers = [
      { text: 'Name', value: 'name' },
      {
        text: 'Phone Number',
        value: 'phone_number',
        render: () =&gt; (
           &lt;div&gt;
             &lt;p&gt;Custom Render&lt;/p&gt;
           &lt;/div&gt;
       )
      },
      { text: 'Actions', value: 'actions' }
  ]
  </code></pre>
  <p>So from the code above we can see that I want to render that paragraph from the render function inside <strong>Phone Number header</strong>, I did this thing in <strong>React Js</strong> before, but I cannot find a way to do it in <strong>Vue Js</strong> if someone can point me in the right direction would be fantastic. Thank you in advance.</p>