reactjs 如何修复对象是无效的作为一个React子错误在Next.js 13和下一个认证？

oknrviil 于 2023-01-17 发布在 React

关注(0)|答案(1)|浏览(122)

我正在使用带有firebase和Next Auth的Next JS 13构建一个应用程序。在我实现firebase到Next Auth并使用会话后，它抛出了一个错误。

Error: Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children, use an array instead.

当我控制台记录会话它的值返回如预期，甚至当我使用图像属性，它显示图像.但它抛出这个错误很多次.我不知道这问题是什么？
我所做的是，在我的page.jsx中，我像这样导入会话。

import { useSession, signIn, signOut } from "next-auth/react";

事后

const { data: session } = useSession([]);
console.log(session);

控制台返回为

{user: {…}, expires: '2023-02-14T10:09:58.384Z'}

用户返回

user:
  email: "mohammedbekele87@gmail.com"
  image: "https://lh3.googleusercontent.com/a/AEdFTp7e3CC9nfTaGDkKD-mebf-wxL6qZKyf70jArUw5=s96-c"
  name: "Mohammed Bekele"

有人能帮我吗？

reactjs

来源：https://stackoverflow.com/questions/75126409/how-to-fix-objects-are-not-valid-as-a-react-child-error-in-next-js-13-and-next-a

1条答案

按热度按时间

mi7gmzs61#

尝试使用async/await语法来处理这个承诺，如下所示：

import { useSession, signIn, signOut } from "next-auth/react"; 

    export default async function test() {
        const { data: session } = useSession([]);
        const activeSession = await session;
        console.log(activeSession);
        if(activeSession) {
           // return session data
           {session.user.name}
           {session.user.email}
           <img className="" src={session.user.image} alt="" />
           console.log(session);
        } else {
           // return login page
        }
  }

或者，您可以使用.then（）函数，如下所示：

import { useSession, signIn, signOut } from "next-auth/react"; 
    
        const { data: session } = useSession([]);
        session.then(session => {
          console.log(session);
          if(session) {
             // return session data
             {session.user.name}
             {session.user.email}
             <img className="" src={session.user.image} alt="" />
          } else {
            // render the component for unauthenticated user
          }
        });

赞(0）回复(0）举报 2023-01-17

我来回答

reactjs 如何修复对象是无效的作为一个React子错误在Next.js 13和下一个认证？

1条答案

相关问题

热门标签

最新问答