vue 使用component 动态组件为什么不成功

Question

1.为什么使用component 动态的添加组件没有成功，

<template>

<component @showHide="recieveAddData" :is="addModal"

 ></component>

 <button @click="switchComponent"></button>

</template>

import modal from './company/modal.vue'

export default {

name: 'addItem',

data () {

  addModal: 'modal'

},

methods: {

  switchComponent () {

   this.addModal = 'first'

},

components: {

  modal,

  first: {

     template: "<div>这里是子组件3</div>"  

  }

}

}

为什么组件first是可以动态的添加上的，为什么引入的modal 组件不行呢？