平时工作中我们可能会碰到如下情况：
在情况1下我们需要渲染A组件，在情况2下我们需要渲染B组件。。。，这时候我们客以考虑使用vue的动态组件这个特性。
代码如下：
new Vue({ el: '#app', template: '<div><component :is="child"></component><div @click="changeChild" style="color: red; cursor: pointer">Click me To Change the Child</div></div>', data: function(){ return{ child: 'first' } }, methods: { changeChild(){ let currentChild = this.child if(currentChild === 'first'){ this.child = 'second' } else { this.child = 'first' } } }, components: { first: { template: '<div>I am the first child!</div>' }, second: { template: '<div>I am the second child!</div>' } } })这样就实现了点击之后实现了不同组件的挂载。
到这里其实就动态组件其实已经差不多了，不过我们如果想通过缓存来提升性能，这里我们可以通过keep-alive来实现组建的缓存，不过这里我们不打算详细讨论keep-alive这个组件。
