vue.js - vue js 3 路由不起作用 - 不改变路由

Question

index.js

import { createWebHistory, createRouter } from "vue-router";
import Home from "@/views/Home.vue";
import About from "@/views/About.vue";
import Blog from "@/views/Blog.vue";
import Services from "@/views/Services.vue";
import Contact from "@/views/Contact.vue";

const routes = [
  {
    path: "/",
    name: "Home",
    component: Home,
  },
  {
    path: "/about",
    name: "About",
    component: About,
  },
  {
    path: "/services",
    name: "Services",
    component: Services,
  },
  {
    path: "/blog",
    name: "Blog",
    component: Blog,
  },
  {
    path: "/contact",
    name: "Contact",
    component: Contact,
  },
];

const router = createRouter({
  history: createWebHistory(),
  routes,
});

export default router;

应用程序.vue

<template>
  <div id="nav">
      <router-link to="/">Home</router-link> 
      <router-link to="/about">About</router-link>
      <router-link to="/services">Services</router-link>
      <router-link to="/contact">Contact</router-link>
      <router-link to="/blog">Blog</router-link>
  </div>
  <router-view />
</template>

main.js

import { createApp } from 'vue'
import App from './App.vue'


import router from './router'  


createApp(App).use(router).mount('#app')

我的代码在这里。当我按下关于，服务等时没有变化。

我哪里错了，我找不到。

当我在浏览器上写 localhost:8081/关于它不起作用时。它转到本地主机：8081

有什么问题，如果你帮助我，我会很高兴。谢谢

标签： vue.js