Next.js中的React Aria错误:Prop `id`不匹配

mgdq6dx1  于 2023-04-20  发布在  React
关注(0)|答案(1)|浏览(105)

我正在Next.js中测试React Aria,一直收到这个错误。警告:Prop id不匹配。服务器:“react-aria-3”客户端:“react-aria-10”
使用SSRProvider组件 Package _app. js无法解决此问题

export default function App({ Component, pageProps }: AppProps) {

  return (
    <SSRProvider>
      <Component {...pageProps} />
    </SSRProvider>
  );
}

我正在使用Next.js 13。不知道如何解决这个问题。

zvms9eto

zvms9eto1#

您必须将整个应用程序 Package 在SSRProvider Reference中:https://react-spectrum.adobe.com/react-aria/ssr.html
// root AriaSSRProvider.tsx

"use client";

import { ReactNode } from "react";
import { SSRProvider } from "react-aria";

export default function AriaSSRProvider(props: { children: ReactNode }) {
  const { children } = props;
  return <SSRProvider>{children}</SSRProvider>;
}

// root layout.tsx

import { ReactNode } from "react";
import AriaSSRProvider from "./AriaSSRProvider";

export default function AdminLayout(props: { children: ReactNode }) {
  const { children } = props;
  return (
    <AriaSSRProvider>
      {children}
    </AriaSSRProvider>
  );
}

相关问题