使用 Fetch 有时会出现类型错误，因为照片的 href 未定义

Question

我正在建设一个房地产网站并从 api 获取信息，我正在这样做

fetch(
        `https://realtor.p.rapidapi.com/properties/detail?listing_id=${ids.listId}&prop_status=${ids.propStatus}&property_id=${ids.propId}`,
        {
          method: "GET",
          headers: {
            "x-rapidapi-host": "realtor.p.rapidapi.com",
            "x-rapidapi-key":
              "xxxxxxxxxx"
          }
        }
      )
        .then(response => {
          const json = response.json();
          return json;
        })
        .then(json =>
          setDetails({
            photos: json.listing.photos.map(photo => photo.href),
            propertyType: json.listing.raw_prop_type,
            price: json.listing.price,
            beds: json.listing.beds,
            baths: json.listing.baths,
            sqrft: json.listing.sqft,
            yearBuilt: json.listing.year_built,
            listingAgent: json.listing.agent.name,
            email: json.listing.agent.email,
            photoCentered: json.listing.agent.photo.href,
            description: json.listing.description,
            loanAmount: json.listing.mortgage.estimate.loan_amount,
            rate: json.listing.mortgage.estimate.rate,
            term: json.listing.mortgage.estimate.term,
            monthlyPayment: json.listing.mortgage.estimate.monthly_payment,
            principle_interest:
              json.listing.mortgage.estimate.principle_and_interest,
            monthPropertyTax:
              json.listing.mortgage.estimate.monthly_property_taxes,
            monthlyHomeInsurance:
              json.listing.mortgage.estimate.monthly_home_insurance,
            totalPayment: json.listing.mortgage.estimate.total_payment,
            downPayment: json.listing.mortgage.estimate.down_payment,
            listingDateValue:
              json.listing.client_display_text.listing_date_value,
            addressNeighborhood:
              json.listing.client_display_text.address_with_neighborhood,
            propertyDisplayName:
              json.listing.client_display_text.prop_type_display_name
          })
        )
        .catch(err => {
          console.log(err);
        });

问题是有时房地产经纪人的照片有一个未定义的 href。当发生这种情况时，none 的其他数据通过。有没有办法捕捉到这一点，以便如果该值未定义，我仍然可以获得所有其余数据？

Answer 1

我建议在 photos 数组的映射中检查未定义的值

photos: json.listing.photos.map(photo =>{
   if(typeof photo.href === 'undefined'){
      return '';
   }
   return photo.href;
}),

您也可以用默认图片代替空字符串

使用 Fetch 有时会出现类型错误，因为照片的 href 未定义

Using Fetch sometimes getting a type error because href of photo is undefined

json

fetch

promise

reactjs

fetch-api