ajax - NextJS - 在页面上保留页眉和页脚
问题描述
我想知道他们是否仍然拥有它,以便在单击导航菜单时仅在 <main className={styles.main}>
Ajax 允许的情况下更改内容?
我知道使用 ReactJS 我可以做到这一点 - 但无论我阅读了多少文档,我都无法用 NextJS 弄清楚。
目前我有预加载/预取,但页眉和页脚消失了。
在我的 index.js 中,我的链接看起来像这样。
<Link href="/news" prefetch className={styles.card}>
<a>news.</a>
</Link>
完整的 index.js 代码
<div className={styles.container}>
<Head>
<title>Create Next App</title>
<meta name="description" content="Generated by create next app" />
<link rel="icon" href="/favicon.ico" />
<meta property="og:image" content="https://www.drn1.com.au/img/websitepromo.jpg"></meta>
</Head>
<main className={styles.main}>
<div className={styles.grid}>
<Link href="/news" prefetch className={styles.card}>
<a>news.</a>
</Link>
</div>
</main>
<footer className={styles.footer}>
<a
href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
Powered by{' '}
<span className={styles.logo}>
<Image src="/vercel.svg" alt="Vercel Logo" width={72} height={16} />
</span>
</a>
</footer>
</div>
我只想 <main className={styles.main}>
重新加载该区域而不是整个页面。
有任何想法吗
解决方案
推荐阅读
- html - 删除个人资料 django 上的帖子
- tailwind-css - TailwindCSS + Alpine 移动导航栏不起作用
- python - NLP:如何搜索带括号的字符串?
- excel - 插入一列
- sql - 如何使用 ActiveRecord 进行排序、求和和加入
- java - 为什么 JsonDeserialize 无法使用 Lombok SuperBuilder 构造类
- javascript - 如何获取您不知道的文件的目录
- multithreading - 调用 REST API 时线程的空中交通控制器
- html - 如果表格单元格具有特定的背景颜色,则 CSS 悬停不适用于表格单元格
- sql - 如何根据每个值的 2 个最早日期返回值