Vue.js 路由在刷新时发送到 404

Question

我已经制定了路线，如果点击网站中的链接，它应该可以正常工作。但是，当您在该页面上（例如 /aboutUs）并刷新它或简单地复制 url 时，将其粘贴并按 Enter 显示页面未找到。如何解决？想法用完了，找不到任何地方都适用的答案

main.js 下面：

Vue.config.productionTip = false;

Vue.use(VueRouter);

Vue.prototype.$careerEmpty = false;

const router = new VueRouter({
    mode:'history',
    scrollBehavior(to, from, savedPosition){
        if (to.hash) {
            return { selector: to.hash}
        } else if (savedPosition) {
            return savedPosition;
        } else {
            return {x:0, y:0}
        }
    },
    routes
});

new Vue({
  router,
  render: h => h(App),
}).$mount('#app')

routes.js 下面：

import firstPage from "@/components/Pages/firstPage";
import aboutUsPage from "@/components/Pages/aboutUsPage";
import pageNotFound from "@/components/pageNotFound";

const routes = [
    {path: '/', component: firstPage},
    {path: '/aboutUs', component: aboutUsPage},
    {path: '/404', component: pageNotFound},
    {path: '*', redirect: '/404'},
];

export default routes;

Answer 1

您可以使用 vue 路由器历史模式。 Check here

Vue.use(路由器, { 模式：'历史' });