vue.js - 如何在 Nuxt 的 asyncData 中重定向
问题描述
我是 vue.js 的新手,我有一个简单的问题。
我有如下代码:
asyncData({ params, error }) {
return Job.api()
.fetchByID(params.id)
.then((response) => {
const selectedJob = response.entities.jobs[0]
if (selectedJob) {
const industryID = selectedJob.industryId
return Industry.api()
.fetchByID(industryID)
.then((result) => {
const jobInd = result.response.data
return {
tagsArray:
selectedJob.tags === 'null' || selectedJob.tags === ''
? []
: selectedJob.tags.split(','),
job: selectedJob,
jobIndustry: jobInd,
}
})
.catch(() => {
error({
statusCode: 404,
message: 'Job Industry not found',
})
})
}
})
.catch(() => {
error({
statusCode: 404,
message: 'Job not found',
})
})
},
我想知道在捕获错误 404 后如何将页面重定向到主页。
解决方案
asyncData()
的参数是Nuxt context,其中包括redirect()
可用于重定向用户的参数:
export default {
asyncData({ redirect, params, error }) {
return Job.api()
.fetchByID(params.id)
.then(/*...*/)
.catch(() => {
redirect('/')
})
}
}
推荐阅读
- python - 计算页面的可能点击次数
- java - 无法调用 onHandleIntent 之外的方法或访问方法
- ios - iOS Swift 过滤器和生成模型需要太多时间
- javascript - Webpack - 在加载器选项中访问 loaderContext
- drop-down-menu - 语义 UI:下拉框无法选择多个选项
- css - 如何在 Vaadin 10 中更改组合框的样式
- raspberry-pi - 在 RASPBERRY PI3 中读取 GPIO 的频率
- python - 获取系列中的最后一个值以匹配熊猫中的某些条件
- machine-learning - 将 dropout 应用于 LSTM 网络(Keras)中的输入层
- html - Angular - 默认情况下在下拉列表中显示空行并禁用按钮