如何解决Activity Indicator同时在Tab1和Tab2显示，仅需Tab2加载时展示的问题

问题根因 #

你写的第二个Tab的三元判断逻辑存在作用域错误：
当前逻辑为：this.state.currentTab === 2 && this.state.metadata != null ? 渲染Tab2 : 渲染加载指示器
当currentTab === 1时，currentTab === 2的条件不成立，整个三元运算就会触发else分支，直接渲染加载指示器，所以Tab1页面会一直出现加载动画。

修复方案 #

把加载指示器的显示范围限制在仅currentTab为2的场景下即可，修改后的代码如下：

<ScrollView style={{flex: 1}}>
  {this.state.currentTab === 1 ? (
    <View style={{flex: 1}}>
        <Avatar
          marginLeft={20}
          rounded
          source={{uri: image}}
        />
    </View>
  ) : null}
  {this.state.currentTab === 2 ? (
    this.state.metadata != null ? (
      <View style={{flex: 1, paddingBottom: 20}}>
        <Text style={styles.sectionHeader}> History</Text>
      </View>
    ) : (
      <ActivityIndicator size="large" />
    )
  ) : null}
</ScrollView>

逻辑说明 #

• 当currentTab === 2时，才进入Tab2的判断分支，此时再根据metadata是否加载完成决定显示内容还是加载指示器
• 当currentTab === 1时，Tab2的整个分支返回null，不会额外渲染加载指示器

内容的提问来源于stack exchange，提问作者Frank Boccia