Javascript 错误："；React.Children.仅期望接收单个React元素子级“；（Next.js）
我不熟悉Next.js，我正在按照官方文档中的示例进行尝试 我在尝试下一个布局组件时遇到错误Javascript 错误："；React.Children.仅期望接收单个React元素子级“；（Next.js）,javascript,reactjs,next.js,Javascript,Reactjs,Next.js,我不熟悉Next.js，我正在按照官方文档中的示例进行尝试 我在尝试下一个布局组件时遇到错误 layout.js文件： // To style the layout for the entire App import Head from "next/head"; import Link from "next/link"; import utilStyles from "../styles/utils.module.css"; impor
layout.js// To style the layout for the entire App
import Head from "next/head";
import Link from "next/link";
import utilStyles from "../styles/utils.module.css";
import styles from "./layout.module.css";
const name = "Aashiq Ahmed";
export const siteTitle = "Next.js Sample Website";
export default function Layout({ children, home }) {
return (
<div className={styles.container}>
<Head>
<Link rel="icon" href="/"></Link>
<meta
name="description"
content="Learn how to build a personal website using Next.js with Aashiq"
/>
<meta
property="og:image"
content={`https://og-image.now.sh/${encodeURI(
siteTitle
)}.png?theme=light&md=0&fontSize=75px&images=https%3A%2F%2Fassets.vercel.com%2Fimage%2Fupload%2Ffront%2Fassets%2Fdesign%2Fnextjs-black-logo.svg`}
/>
<meta name="og:title" content={siteTitle} />
<meta name="twitter:card" content="summary_large_image" />
</Head>
<header className={styles.header}>
{home ? (
<>
<img
src="/images/profile.png"
className={`${styles.headerHomeImage} ${utilStyles.borderCircle}`}
alt={name}
/>
<h1 className={utilStyles.heading2Xl}>{name}</h1>
</>
) : (
<>
<Link href="/">
<a>
<img
src="/images/profile.png"
className={`${styles.headerImage} ${utilStyles.borderCircle}`}
alt={name}
/>
</a>
</Link>
<h2 className={utilStyles.headingLg}>
<Link href="/">
<a className={utilStyles.colorInherit}>{name}</a>
</Link>
</h2>
</>
)}
</header>
<main>{children}</main>
{!home && (
<div className={styles.backToHome}>
<Link href="/">
<a>Back to home</a>
</Link>
</div>
)}
</div>
);
}
import "../styles/globals.css";
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />;
}
export default MyApp;
\u app.js// To style the layout for the entire App
import Head from "next/head";
import Link from "next/link";
import utilStyles from "../styles/utils.module.css";
import styles from "./layout.module.css";
const name = "Aashiq Ahmed";
export const siteTitle = "Next.js Sample Website";
export default function Layout({ children, home }) {
return (
<div className={styles.container}>
<Head>
<Link rel="icon" href="/"></Link>
<meta
name="description"
content="Learn how to build a personal website using Next.js with Aashiq"
/>
<meta
property="og:image"
content={`https://og-image.now.sh/${encodeURI(
siteTitle
)}.png?theme=light&md=0&fontSize=75px&images=https%3A%2F%2Fassets.vercel.com%2Fimage%2Fupload%2Ffront%2Fassets%2Fdesign%2Fnextjs-black-logo.svg`}
/>
<meta name="og:title" content={siteTitle} />
<meta name="twitter:card" content="summary_large_image" />
</Head>
<header className={styles.header}>
{home ? (
<>
<img
src="/images/profile.png"
className={`${styles.headerHomeImage} ${utilStyles.borderCircle}`}
alt={name}
/>
<h1 className={utilStyles.heading2Xl}>{name}</h1>
</>
) : (
<>
<Link href="/">
<a>
<img
src="/images/profile.png"
className={`${styles.headerImage} ${utilStyles.borderCircle}`}
alt={name}
/>
</a>
</Link>
<h2 className={utilStyles.headingLg}>
<Link href="/">
<a className={utilStyles.colorInherit}>{name}</a>
</Link>
</h2>
</>
)}
</header>
<main>{children}</main>
{!home && (
<div className={styles.backToHome}>
<Link href="/">
<a>Back to home</a>
</Link>
</div>
)}
</div>
);
}
import "../styles/globals.css";
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />;
}
export default MyApp;
导入“./styles/globals.css”；
函数MyApp（{Component，pageProps}）{
返回；
}
导出默认MyApp；
提前谢谢。也许是你版面中的空链接。js？@WilliamRizzi，老兄，非常感谢，这真的很有帮助，我真是瞎了眼！