React Native条件渲染暂时显示内容

时间:2017-04-17 13:16:59

标签: react-native

我的渲染功能有条件。如果不满足if语句,则会在else块显示之前临时显示。

render() {
    let renderedContent = null

    if (this.props.tabLabel === 'Schedule' && this.getReportsForTab(this.props.reports).length === 0) {
      renderedContent = (
        <View style={styles.addInspectionContainer}>
          <Button block primary style={styles.button} onPress={() => this.props.onAddReport()}>Add Inspection</Button>
        </View>
      )
    } else {
      renderedContent =  (
        <ListView
          dataSource={this.state.dataSource}
          renderRow={this.renderReport}
          renderSectionHeader={this.renderSectionHeader}
        />
      )
    }

    return renderedContent
  }

这不应该发生。任何想法如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

我最终解决了这个问题。页面未完全加载时显示if块。我在if语句中添加了一个this.props.loaded:

if (this.props.loaded && this.props.tabLabel === 'Schedule' && this.getReportsForTab(this.props.reports).length === 0)