[Solved]-I can not get the state from react router Link component using useLocation. So how can I pass it?-Reactjs

in react-router-dom v6 the link component api changed a bit, route state is now a top-level prop instead of being nested in a to prop's object.

link

interface linkprops
  extends omit<
    react.anchorhtmlattributes<htmlanchorelement>,
    "href"
  > {
  replace?: boolean;
  state?: any;
  to: to;
  reloaddocument?: boolean;
}

move the nested state property out to be a link state prop.

<link
  to={`/quiz/${video.youtubeid}`}
  state={{ videotitle: video.title }} // <-- state prop
  key={video.youtubeid}
>
  <video
    title={video.title}
    id={video.youtubeid}
    noq={video.noq}
  />
</link>

you also are not accessing the location object correctly, the uselocation hook returns a location object, not an object with a location property.

const location = uselocation();
const { state } = location;

or destructure state directly

const { state } = uselocation();