有條件地將一個變量的值賦給一個可能爲空的對象的屬性

Question

我從API獲取的JSON響應具有一個特定的屬性，偶爾有一個null值。我正在使用JSX，並希望在響應中使用.map，並將道具傳遞給另一個組件。我希望傳遞的值是我從API 或收到的非空值，這是我選擇的一個字符串。我已經嘗試過多種方式，全部都有相同的結果：Cannot read property url of undefined。

這是我已經試過：

{posts.map((post, index) => { 
      let p = null 
      if (typeof post.default_image.url == null) { 
      p = "via.placeholder.com/350x150" 
      } 
      return <Post 
         key={index} 
         imageUrl={post.default_image.url ? "hi" : "bye"} 
         /> 
      })} 

除了

let url = typeof post.default_image.url == null ? default_image.url : "via.placeholder.com/350x150" 

，然後向下傳遞喜歡像imageUrl={url}

我怎麼能去這樣做？

Answer 1

它是因爲default_image不存在，你不能得到一個什麼都沒有的屬性。可以檢查該

let p = post.default_value && post.default_value.url || "via.placeholder.com/350x150"; 

是的，工程（被稱爲短路;））

Answer 2

typeof <anything here>將永遠等於空。即使typeof null is "object"。

我認爲你正在試圖做的是這樣的：

let url = (post && post.default_image && post.default_image.url) 
    ? post.default_image.url 
    : "via.placeholder.com/350x150"