Question

我从API获取的JSON响应具有偶尔具有null值的特定属性。我使用JSX并想要.map响应，将props传递给另一个组件。我希望传递的值是我从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> 永远不会等于null。甚至是typeof null is "object"。

我认为你要做的是：

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

有条件地将变量的值赋给对象的属性，该属性可以为null

2 个答案: