代码之家 › 专栏 › 技术社区 › Axel

如何在Nuxt中验证路由参数?

nuxt.js async-await vue.js javascript

Axel · 技术社区 · 6 年前

我正在尝试验证页面组件中的路由参数,如下所示:

async validate({ params, store }) {
    await store.dispatch(types.VALIDATE_PARAMS_ASYNC, params.id)
}

然后在店内:

async [types.VALIDATE_PARAMS_ASYNC]({state, commit, dispatch}, payload) {
    try {
        const res = await this.$axios.$post('/api/params/validate', {
            params: payload
        })
        commit(types.MUTATE_SET_INFO, res.data) // this mutation is in another module. This doesn't work either
        return true
    } catch(e) {
        return false
    }
}

这根本不管用。即使我输入了无效的参数,它仍然会加载页面。请帮帮我!

1 回复 | 直到 6 年前

Nicolas Pennec 6 年前

validate 方法必须返回布尔值:

async validate({ params, store}) {
    // await operations
   return true // if the params are valid
   return false // will stop Nuxt.js to render the route and display the error page
}

见官方文件: https://nuxtjs.org/api/pages-validate#the-validate-method

async validate({ params, store }) {
    return await store.dispatch(types.VALIDATE_PARAMS_ASYNC, params.id)
}

推荐文章

Michael · 在Nuxt/Vue中安装传单的正确方法

9 月前

hizbul25 · 为什么使用nuxt3 i18n无法正常滑动?

1 年前

udit · Nuxt 3应用程序在生产中不会最小化JS文件

1 年前

Zor · Nuxt3如何在登录后正确存储用户数据

1 年前

Danny · 如何使用Nuxt 3动态处理无尽的嵌套路由?

1 年前

bartttz_000 · 对于像react和nuxt3这样的前端框架,什么是最好的css框架?

1 年前

ê¹ì¬ì · 能否在nuxtjs/i18n中将detectBrowserLanguage设置为本地存储而不是cookie

1 年前

Kenji Crosland · 在Nuxt 3应用程序中成功创建Firebase用户,尽管出现“无效的API密钥”错误

1 年前

L4w1i3t · 为什么我的图像不能正确显示在我的网页上?

1 年前

Jeremy · 如何执行在nuxtjs中加载所有DOM后运行的函数?

1 年前