条件渲染中`?`符号的含义是什么？如何简化多条件判断代码？

1. ?.符号的含义 #

你提到的migrated.value?.user中的?是**可选链操作符（?.）**的组成部分，作用是安全访问嵌套对象属性：

• 当?.左侧的属性值为null或undefined时，整个表达式会直接返回undefined，不会抛出「无法读取null/undefined属性」的运行时错误
• 不需要再手动写多层前置非空判断，能大幅简化嵌套属性访问的代码

2. 条件渲染代码简化方案 #

你原代码的核心逻辑是：只要满足以下任意一种情况就返回null，否则渲染<MigratedToNew />组件：

• migrated.value 为 null
• migrated.value?.user 为 null
• migrated.user?.migrated_to_new_login 为 null 或等于0

我们可以直接利用可选链+逻辑与的特性简化代码，简化后如下：

{migrated.value?.user && migrated.user?.migrated_to_new_login ? (
  <MigratedToNew
    passwordValue={passwordValue}
    setPasswordValue={setPasswordValue}
  />
) : null}

如果原代码中后面的migrated.user是笔误，实际是要访问migrated.value.user下的属性，还可以进一步简化为：

{migrated.value?.user?.migrated_to_new_login ? (
  <MigratedToNew
    passwordValue={passwordValue}
    setPasswordValue={setPasswordValue}
  />
) : null}

因为migrated_to_new_login为0时属于假值，和null/undefined的判断逻辑完全一致，不需要额外写等值判断。

内容的提问来源于stack exchange，提问作者Junaid Razaq