Questions tagged [next-link]
The next-link tag has no usage guidance.
78
questions
0
votes
1
answer
196
views
Next JS Routing with Link Component in Production
I have a simple NextJS 14 app (I am new to NextJS) I have set a simple web app with 3 routes for testing I have developed the route page it contains 1 background video and few images.
I did deploy the ...
- 21
0
votes
0
answers
59
views
How jump to another page anchor target from current page in next.js 14
I am building a website with Next.js 14, and use anchor tag scrolling the target in Homepage. but I still have a Blog page, the problem is, when the current page is blog page or post page, how to jump ...
0
votes
0
answers
10
views
NextLink is 1 step behind
So this is my component state:
export default function DateNavigator() {
const [currentDate, setCurrentDate] = useState(new Date());
const urlDate = formatToDateOnlyISO(currentDate);
console....
- 1,394
0
votes
0
answers
12
views
How to scroll to the main component on backpress in Next JS using Links?
Here is what I want to achieve. I have few components that I have embedded in my layout. The sidebar is component is mapping through the Links to display links. When i click on the link, I move to ...
- 63
0
votes
1
answer
90
views
Next.js link component send parameter = undefined
How can I pass parameters to a component using the Link component? The following doesn't work. I always get undefined in SinglePost.
<Link
key={2}
href={{
pathname: "/...
- 1,340
0
votes
0
answers
56
views
next/link takes too long to load a new path
I have built a NextJS dashboard which uses next/link to navigate through a dynamic no of pages and hence I have mapped a next/Link component for each page.
const navbarItems = [
{ link: '/', Icon: ...
- 414
0
votes
0
answers
38
views
Context data lost in NextJS dev mode
In NextJS I’m using context, everything works fine but when I navigate with next/link then the context’s data is lost.
I have to fetch, set everything again. But when i create build and then check in ...
- 23
0
votes
1
answer
814
views
Anchor links (#) not working within the same page in Next.JS app router
I have a <Link/> component with the href set to #targetDiv in my Next.js app. Ideally, when a user clicks on the button/link, the page should scroll to the respective section with the id #...
- 11
0
votes
0
answers
26
views
I can't use the href on my page, it gives a 404 error
It's giving this error
After clicking this
My code is like this:
import './header.css';
import { FaHeart } from 'react-icons/fa';
import Link from 'next/link';
export default function Header() {
...
- 1
0
votes
0
answers
474
views
NextJS13 doesn't scroll to top after redirect
I've wrote a whole code of site using but unfortunetly in NextJS 13 it doesn't scroll me to top of the page after redirect. Any ideas why? I checked documentation and there is scroll={true} as ...
0
votes
1
answer
226
views
How to do components wise routing in NEXT.js? [closed]
I have a sidebar which contains some tabs like profile, settings, insights now when click on one of the tab it should show particular content where routes should change but page should not be refresh.
...
0
votes
0
answers
122
views
how replace Hashtag with Link in NEXTJS
I tried dangerouslySetInnerHTML but still not working it only returns an [object Object]
how to use Link to replace the hashtags in string
import Link from 'next/link';
export default ...
- 1
0
votes
2
answers
1k
views
Next.js Link component not added to DOM with child component?
There's plenty of information about how to use Next.js' Link module if the child itself has an <a> tag within it (passHref), but there seems to be no indication that this should be needed for ...
- 6,818
0
votes
0
answers
244
views
Next js file routing not working after deployment
i created and deployed a next js application on vercel using github , after deployment i access the site , i noticed that the homepage loads just fine but i am unable to access other pages the ...
0
votes
1
answer
751
views
Nextjs Link not redirect page properly
I am using slug page directory with next.js.
My directory is
Pages
-Main
--[cat]
---[content].js
When i use next/link from another page to go content page it works and loads fine. But when i use some ...
0
votes
4
answers
4k
views
My Link with href doesn't scroll even though the link changes. Nextjs
I'm working on a react with nextjs project.
I'm using Link to scroll to a specific section on the same page.
Here is one of the components that use Link:
import styles from './section1.module.scss';
...
- 15
0
votes
0
answers
1k
views
Next / Link doesn't route to the next page when clicked before the page has completely loaded
import Link from 'next/link';
...
<Link href="/test">test</Link>
Clicking on the link doesn't route to the next page when the network is slow, and the entire page hasn't been ...
0
votes
1
answer
988
views
Next/Link refreshes page on shallow routing
I have a Link:
<Link href={href} passHref shallow>
<StyledLink
$active={active}
$disabled={disabled}
onClick={() => passBackNumber(number)}
>
...
- 1,770
0
votes
1
answer
2k
views
next/link redirect and should to scroll, it should directly positioning to top
I have next js web, which has some links to redirect on the footer,
so if I click on that link it is first redirected to that page with scrolled down(current position) and then scrolls the up
I don't ...
- 61
0
votes
0
answers
967
views
how to link to page in Next.js with locale when project is in subdirectory?
I have a problem with routing in next.js.
Project on the server is in subdirectory: exmaple.com/app.
Routing i want to achieve: example.com/app/<locale>/<pageName>
(add prefix before url). ...
- 141
0
votes
0
answers
77
views
Next/Link works laggy
I have next.js site on production works with strapi. I have three main pages and dynamic sub pages.
- "/"
- "/[slug]"
- "/About"
- "/Contact"
"/[slug]...
- 57
0
votes
1
answer
60
views
"Hydration failed because the initial UI does not match......" error showing when I m nesting multiple div inside next Link tag
React 18: Hydration failed because the initial UI does not match what was rendered on the server error showing when I am nesting multiple div in a Link tag
my code is given below:-
<Link href={'/...
-1
votes
2
answers
799
views
LinkProps is missing in next-intl/link (when migrating from next/link)
I used LinkProps to create custom Link wrappers and pass native props along with my custom ones. Pretty standard pattern:
import {type LinkProps} from "next/link";
import {type ImageProps} ...
- 2,154
-1
votes
1
answer
517
views
Page routing through dropdown (NEXT.js)
I want to route to different pages through dropdown selection. I'm new to react & next, and i have no idea how to do it.
"use client"
import Link from 'next/link';
function Home() {
...
- 33
-1
votes
1
answer
2k
views
Next js with dynamic routing ([[…slug.js]]) to handle all URLs show 404 for links to home page - but only when deployed
I want a single dynamic route to handle all requests in this application, so I have written a file named [[...slug]].js to do so. I use getServerSideProps() for data loading, so it is server-side ...
- 6,127
-1
votes
1
answer
203
views
does next link has built in style
Next Link ruin my style (display flex)
<main>
<div className="flex">
{res.results.map((movie) => (
<Image
src={imagePath + movie....
-1
votes
1
answer
892
views
Next.js: how to create entry browser history [duplicate]
I have been trying to create an entry in the browser history every time I navigate to a new page in Next.js with the Link property provided by them, but I am not able to push an entry to the browser ...
-1
votes
1
answer
123
views
How do I make the Link appear above the component I made?
How do I make the Link appear above the component I made?
Im using Next.js 11 version.
This is error message.
Warning: Function components cannot be given refs. Attempts to access this ref will fail. ...
- 123