0

I get this error when I try to catch all the routes

TypeError: Cannot read properties of undefined (reading 'length')

This error happened while generating the page. Any console logs will be displayed in the terminal window.

Here's my code:

import {useRouter} from "next/router";
function Docs() {
    const route = useRouter();
    const {params} = route.query;
    console.log(params);
    
    if(params.length === 1){
        return (
            <div>
                <h1>Docs {params[0]}</h1>
            </div>
          )        
    }

    else if (params.length === 2){
        return (
            <div>
                <h1>Docs {params[0]} feature </h1>
            </div>
          )        
    }
    else{
        return (
            <div>
            <h1>Docs home page</h1>
         </div>
      )    
    }
}

export default Docs

Here's my folder structure: Project Folder structure

and I'm following this Youtube Video for learning NextJS, Somebody help me out. Thanks.

Arunprasath
  • 57
  • 1
  • 7
  • Does this answer your question: [Next.js router is returning query parameters as undefined on first render?](https://stackoverflow.com/questions/67332108/next-js-router-is-returning-query-parameters-as-undefined-on-first-render)? For pages that don't have data fetching requirements (like yours) the query string object will be an empty object during pre-rendering (meaning `params` will be undefined). You need to wait for `router.isReady` to be `true` before accessing the query params. – juliomalves Mar 13 '22 at 15:56

1 Answers1

-2

Inside pages/docs just remove one extra bracket it should be like this [...params].js

Paiman Rasoli
  • 1,088
  • 1
  • 5
  • 15