Vue.js - Props with Inline Templates

01-app.js

Vue.component('List', {
  data: () => ({
    names: [
      'Ryan',
      'Alexa',
      'Jimmy'
    ]
  })
})

Vue.component('Item', {
  props: [ 'name' ]
})

new Vue({ el: '#app' })

02-view.html

<div id="app">
  <div is="list" inline-template>
    <ul class="list">
      <div is="item" inline-template
           v-for="name in names" v-bind:name="name">
        <li class="item">{{ name }}</li>
      </div>
    </ul>
  </div>
</div>

03-result.html

<!-- Final Result -->
<div id="app">
  <ul class="list">
    <li class="item">Ryan</li>
    <li class="item">Alexa</li>
    <li class="item">Jimmy</li
  </ul>
</div>