Vue项目界面跳转点击无效

第一次搭建VUE项目，本来就是一个非常简单的界面之间的跳转，如图：

WechatIMG1.jpeg

，是要实现Home，News ，test三个界面之间的跳转，用的跳转代码如下：

<template>
    <div class="home_View">
        这个是home界面
        <router-link to='News'>go News</router-link>
    </div>
    
</template>

<script>
    export default {
        name:'home',
    }
</script>

<style>
</style>

其他两个代码也是相识，本来是很简单的，但是我这里死活没法跳转，最后找到原因，居然是我把App.vue中的一段代码 <router-view/> 删除了的原因,当时删除也是自以为是的看到这个代码怎么只有一半，就认为没啥用，直接干掉了，愚蠢如我，希望大家不要再犯这样的错误，记录一下，引以为戒。

router-view可以当做是一个容器，它渲染的组件是你使用 vue-router 指定的，比如我们用
router-link跳转时，删除了router-view，意味着我们没有渲染的容器了，我们只是做了一个界面的跳转，但是UI等却没有任何的改变。
贴下APP.vue的正常代码：

<template>
  <div id="app">
    <img src="./assets/logo.png">
    <p>我的天，我居然把router-view删除了</p>
    <router-view/>
        
  </div>
</template>

<script>
    
import home from './components/Home.vue'
    
export default {
  name: 'App',
    data(){
        return {
            
        }
    },
    components: {
        home
    }
}
</script>