Vue.js Vue组件正在将我路由到另一个组件

我刚开始使用VUE，在尝试转到组件时遇到了一些问题。我目前有两个组件：列表和详细信息。一个列表加载得很完美，但细节却没有，几个小时盯着代码我都看不清。感谢您的帮助

**main.js**

import Vue from 'vue';
import VueRouter from 'vue-router';
import App from './App.vue';
import List from './components/List.vue';
import Detail from './components/Detail.vue';

Vue.use(VueRouter);
    const routes = [{
      path: '/list',
      name: 'List',
      component: List
    },
    {
      path: '/detail',
      name: 'Detail',
      component: Detail
    },
    {
      path: '/',
      component: List
    }]




**Detail.Vue**

        <template>
    <div>
       <h1>The Detail</h1>
    </div>
    </template>
    
    <script>
    export default {
        name: "Detail"
    };
    </script>
    <style>
    
    </style>

**main.js**
从“Vue”导入Vue；
从“vue路由器”导入VueRouter；
从“/App.vue”导入应用程序；
从“/components/List.vue”导入列表；
从“/components/Detail.vue”导入详细信息；
Vue.use（VueRouter）；
常数路由=[{
路径：'/list'，
名称：'列表'，
组件：列表
},
{
路径：'/detail'，
名称：'详细信息'，
组成部分：细节
},
{
路径：“/”，
组件：列表
}]
**详细信息**
细节
导出默认值{
名称：“细节”
};

这看起来不错（假设应用程序安装在main.js中未显示的位置）。你能告诉我你在哪里换路线吗？我忘了像往常一样添加信息了。。我在本地主机：8080上观看。但是当我试图访问localhost:8080/detail时，不会加载。当尝试输入localhost:8080/list时，列表组件会加载，而详细信息组件不会加载。问题是否仅在键入url时出现？如果您使用

路由器链接

来更改路由，是否有效？如果是这样的话，这是一个服务器配置问题。现在我还没有做任何路由器链接。我是Vue新手，经过几个小时的代码对比，我发现问题出在哪里。这看起来还可以（假设应用程序安装在main.js中没有显示的地方）。你能告诉我你在哪里换路线吗？我忘了像往常一样添加信息了。。我在本地主机：8080上观看。但是当我试图访问localhost:8080/detail时，不会加载。当尝试输入localhost:8080/list时，列表组件会加载，而详细信息组件不会加载。问题是否仅在键入url时出现？如果您使用

路由器链接

来更改路由，是否有效？如果是这样的话，这是一个服务器配置问题。现在我还没有做任何路由器链接。我是Vue新手，经过几个小时的代码对比，我发现问题出在哪里。