我正在从const details中提取交易详细信息，并且需要从JSON paymentResponse中提取brand。我收到了一个未定义的错误，但let cardType中的所有内容看起来都正确。我遗漏了什么？
let cardType = JSON.parse(orderDetails.paymentResponse).data?.payment_method_details?.card?.brand;
代码：

const [orderDetails, setOrderDetails] = useState({});
  
  const getOrderDetails = async () => {
    let data = {};
    data.orderId = params.id;
    const details = await orderApi.getOrderDetails(userAuthToken, data);
    if (details && details.data.success) {
      if (details.data.data.length > 0) {
        setOrderDetails(details.data.data[0]);
      } else {
        navigate('/');
      }
    } else {
      navigate('/');
    }
  };

  useEffect(() => {
    (async () => {
      if (params.id) {
        setLoading(true);
        await getOrderDetails();
        setLoading(false);
      } else {
        navigate('/');
      }
    })();
  }, [params.id]);
  //
  let cardType = JSON.parse(orderDetails.paymentResponse).data?.payment_method_details?.card?.brand;

  console.log(cardType);

JSON结构，其中brand为：

{
   "data":{
      "payment_method_details":{
         "card":{
            "brand":"jcb"
         }
      }
  }
}