当我第一次去这个链接的时候，页眉页脚的样式还可以-

但是当我刷新或重新加载页面时，样式就消失了。如何解决这个问题？

下面是我的router.js-

import { createWebHistory, createRouter } from "vue-router";
import Home from '../components/Home.vue';
import Organization from '../components/aboutus/Organization.vue';


const router = createRouter({
    history: createWebHistory(),
    base: process.env.BASE_URL,
    scrollBehavior() {
        return { x: 0, y: 0 }
    },
    routes: [
        {
            name:'Home',
            path:'/',
            component:Home
        },
        {
            name:'Organization',
            path:'/about_us/organization',
            component:Organization
        },
    ],
})
router.beforeEach((to, _, next) => {

    return next()
})
// ? For splash screen
// Remove afterEach hook if you are not using splash screen
router.afterEach(() => {
    // Remove initial loading
    /*const appLoading = document.getElementById('loading-bg')
    if (appLoading) {
        appLoading.style.display = 'none'
    }*/
})
export default router

下面是main.js-

import { createApp } from 'vue'
import App from './App.vue'
import router from './router/router'
import store from './store/index'

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

就我而言，我改变了

<link rel="stylesheet" href="vendors/bootstrap/dist/css/bootstrap.min.css">

到

<link rel="stylesheet" href="/vendors/bootstrap/dist/css/bootstrap.min.css">

要获得css和javascript文件准确地址， 而且很管用！

所有的css和javascript文件都在index.html导入