[Vuejs]-Vue2 list return mixed string or component

Assume we have a list like this:

headerItems: [
  {
    type: 'text',
    value: 'Some text'
  },
  {
    type: 'img',
    props: {
      src: 'http://some-where....'
    }
  },
  {
    type: 'my-component',
    value: 'v-model value',
    props: {
      prop1: 10,
      prop2: 'Blah bla',
    },
    events: {
      myEvt: () => console.log('myEvt has fired')
    }
  },
],

So, We can render it:

<tr>
  <td
      v-for="(item, i) in headerItems" :key="i"
  >
    <div v-if="item.type === 'text'"> {{ item.value }}</div>
    <component
        v-else
        :is="item.type"
        v-model="item.value"
        v-bind="item.props"
        v-on="item.events"
    />
  </td>
</tr>