** 子组件 search

                <template>
                  <div class="search">
                    小花
                  </div>
                </template>



                ** 子组件 result

                <template>
                  <div class="result">
                    小蓝
                  </div>
                </template>




                ** 父组件
                <template>
                  <div>
                    <!--  
                      component : 创建动态组件插口
                        v-bind:is="变量名=要显示的组件名"
                    -->
                    <component v-bind:is="currentView"></component>
                    <span @click="tag">切换</span>
                  </div>
                </template>

                <script>
                    import Search from './search.vue'
                    import Result from './result.vue'

                    export default {
                      data () {
                        return {
                          currentView: 'Search'
                        }
                      },
                      methods: {
                        tag () {
                          // 切换组件
                          this.currentView = 'Result'
                        }
                      },
                      components: {
                        Search,
                        Result
                      }
                    }
                </script>