一、使用<component>+is实现动态组件插入

<component>：一个用于渲染动态组件或元素的“元组件”。

:is : 要渲染的实际组件，当 is 是字符串，它既可以是 HTML 标签名也可以是组件的注册名。

<script>
import Foo from './Foo.vue'
import Bar from './Bar.vue'

export default {
  components: { Foo, Bar },
  data() {
    return {
      view: 'Foo'
    }
  }
}
</script>

<template>
  <component :is="view" />
</template>

  //给组件传参
  <component :is="view"  :props="xxx"/>