Comments (3)
Start a new pull request in StackBlitz Codeflow.
from nuxt.js.
Your issue occurs when navigating from page A to page B (dynamic routing). However, if we directly enter page B, we won't encounter this error.
This might be caused by vue-router.
We can see more details here:
function resolve(
rawLocation: Readonly<RouteLocationRaw>,
currentLocation?: RouteLocationNormalizedLoaded
): RouteLocation & { href: string } {
// const objectLocation = routerLocationAsObject(rawLocation)
// we create a copy to modify it later
currentLocation = assign({}, currentLocation || currentRoute.value)
The resolve
function in vue-router requires the current route information when it runs. When we directly enter page B, currentRoute.value
is the same as the to
route we receive, so there is no issue with missing params
. However, when navigating from page A to page B, currentRoute.value
is still the original page when the middleware runs, causing the missing params
error.
Therefore, we can also pass currentLocation
to resolve
. Just do this in your global middleware, and it should work correctly:
export default defineNuxtRouteMiddleware((to) => {
const nuxt = useNuxtApp();
const router = nuxt.$router;
to.matched.some((route) => {
const routeTo = router.resolve(route, to);
return routeTo.path === 'products-apple';
});
});
from nuxt.js.
Yes, I think this is a vue-router issue and should be reproducible without Nuxt.
Let me know if not and I'll reopen!
from nuxt.js.
Related Issues (20)
- You must define the vuex store in the server side and use VuexPersistencePlugin in the plugin list. HOT 3
- Nuxt doesn't update when making CSS changes HOT 2
- Nuxt 4 - allow flat layers directory structure without needing `layers` directory, allow each layer to have its own server routes HOT 1
- Nuxt 4 - Internal server error: Failed to resolve import "@vue/devtools-kit"
- Keep context when opening error page
- Wrapping useFetch in a function causes hydration mismatch HOT 6
- Middleware issue when redirecting with encodeURIComponent HOT 6
- keepalive include Bug
- Server (api routes) not working in new app structure HOT 5
- `Nuxt 3.12` - app broke after upgrading. Vue Router warn: No match found for location with path "/settings/account" (repeated 24 times) HOT 1
- Build failing in production (Digital Ocean) - ERROR Cannot find module '/workspace/@nuxtjs/supabase' 3.11.2 - 3.12.2 HOT 10
- Build issue: Lexical.node.mjs not found, only Lexical.prod.mjs present HOT 7
- API behind routing rule provides cryptic response HOT 6
- Documentation Improvment - All package managers throughout docs HOT 2
- Improve Nuxt auto-imports to ignore undefined name properties HOT 3
- Why can't some of my modules be placed in devDependencies?
- Add an option for adding global route middleware that will be executed before all scanned middlewares. HOT 1
- Unable to send options via `addServerHandler` HOT 1
- Default value types of runtime config overwrite global typing HOT 1
- useRequestURL is not defined HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from nuxt.js.