TypeError 中的错误：无法读取未定义的属性（正在读取 \'name\'）

Question

我正在尝试创建一个能够删除列表中的项目的单击事件，但是当我单击它时，我得到“TypeError：无法读取未定义的属性（读取'名称'）”。

而且我很确定可以在某处绑定“ this”，但是我尝试了很多地方但都行不通。

这是我的代码：

import React from "react";
import { useRecoilValue } from "recoil";

import { userProfile } from "../recoil";
import ProfileName from "./components/profileName";

const DetailProfil = () => {
  const profile = useRecoilValue(userProfile);

  return (
    <div>
      <ProfileName
        profilePicture={profile?.profilePicture}
        fullName={profile?.fullname}
        roleDetails={profile?.details.name}
      />

      
    </div>
  );
};

export default DetailProfil;

Answer 1

将可选运算符添加到详细信息对象

roleDetails={profile?.details?.name}