原始样式

import UserName from '@/components/UserName.vue'
import UserInfo from '@/components/UserInfo.vue'

components:{
  UserInfo,
  UserName
},

<UserName></UserName>
<UserInfo></UserInfo>

动态组件样式

import UserName from '@/components/UserName.vue'
import UserInfo from '@/components/UserInfo.vue'

components:{
  UserInfo,
  UserName
},
data () {
  return {
    comName:'UserName'
  }
}

<component :is='comName'></component>

<h1>1、动态dynamic组件使用</h1>
<button @click="comName='UserName'">账号密码填写</button>
<button @click="comName='UserInfo'">个人信息填写</button>