问题
使用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 中