小编use*_*681的帖子

如何在 Vue 中不更改 url 的情况下返回 404 错误?

问题

使用Vue.js,如何在不更改url的情况下在动态路由中返回404错误?

我的route.js的一部分(一切正常)

{

    path: '/work/:id',
    name: 'work',
    component: () => import( './views/Work.vue' )

},

{

    path: '*',
    name: 'NotFound',
    component: () => import( './views/NotFound.vue' )

}
Run Code Online (Sandbox Code Playgroud)

Work.vue 组件的一部分。我检查路由参数是否在我的静态 json 中,如果没有,请在路由输入之前打开 NotFound 组件

beforeRouteEnter (to, from, next) {
    next(vm => {
        vm.item = json.find(item => item.id == vm.$route.params.id)

        if(!vm.item) {
            next({name: NotFound})
        }

    })
}
Run Code Online (Sandbox Code Playgroud)

问题

当我尝试site.com/work/non-existent-id时,组件“NotFound”打开,但网址从site.com/work/non-existent-id转到site.com

我所仰望的

site.com/work/non-existent-id打开组件“NotFound”,并且 url 保留在site.com/work/non-existent-id

例子

https://v2.vuejs.org/v2/guide/something - 返回 404 错误并保留在 url 中

javascript http-status-code-404 vue.js vue-router

5
推荐指数
1
解决办法
1286
查看次数