How to avoid TypeError: Cannot read property 'charAt' of undefined when the json input is not available?

Question

我有一个显示用户名字首字母的头像。 API 调用时会出现用户名列表。如果 API 调用没有发生 TypeError: Cannot read 属性 'charAt' of undefined error coming as there is no input json.我的反应代码如下。

<Avatar
                    style={{ color: "#ffffff", backgroundColor: "#5e206e" }}
                  >
                    {item.user != null ? item.user.charAt(0) : "UU"}
                  </Avatar>

Answer 1

用户仍然可以未定义并抛出错误。我也会先检查用户。

我建议使用 ES2020 中引入的 Optional Chaining。

<Avatar style={{ color: "#ffffff", backgroundColor: "#5e206e" }}>
    {item?.user ? item.user.charAt(0) : "UU"}
</Avatar>

How to avoid TypeError: Cannot read property 'charAt' of undefined when the json input is not available?

How to avoid TypeError: Cannot read property 'charAt' of undefined when the json input is not available?

javascript

charat

reactjs