我有一个VUEJS SSR设置,但不知道如何解决此问题。
我的路线是这样的:
{
path: '/:blogSlug', component: BlogPost, name: 'blog-post'
}
然后在asyncData函数中,我有以下代码:
asyncData({store, route, router}) {
let slug = route.params.blogSlug
if (!store.state.blog.posts[slug]) {
return store.dispatch('FETCH_BLOG_POST', { slug: slug }).catch((error) => {
console.log("error - pushing to /404")
router.push('/404');
})
}
return(Promise.resolve());
}
现在,如果我禁用我的JavaScript,这主要是因为在服务器上执行了asyncData(),然后,如果找不到博客文章,我会推送('/404'),这会显示一个漂亮的“未找到”页面,并将html发送回去浏览器。
然后,主要是因为浏览器中的URL尚未更改,在水合过程中,一切都变了,因为VueJS仍在尝试呈现BlogPost组件而不是404。
我的问题是,我可以在窗口中设置更新的网址。 INITIAL_STATE 吗?
还是可以以某种方式从浏览器更改URL?
如果不清楚,我可以在问题中添加您需要的所有内容。
最佳答案
好吧,我知道了,没有更新。现在做起来也比以往任何时候都要好。
Nuxt还提供error
函数作为asyncData
中的参数。
这可以通过以下方式解决:
asyncData({store, route, router, error}) {
let slug = route.params.blogSlug
if (!store.state.blog.posts[slug]) {
return store.dispatch('FETCH_BLOG_POST', { slug: slug }).catch((error) => {
console.log("error - pushing to /404")
error({ statusCode: 404, message: 'Post not found' })
})
}
}
关于javascript - asyncData中的Vuejs + SSR + router.push(),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/48526292/