React Native條件呈現臨時顯示內容

我在我的渲染函數中有一個條件。當if語句不符合時，它會在else塊顯示之前臨時顯示。React Native條件呈現臨時顯示內容

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 
    }

這不應該發生。任何想法如何解決這一問題？

來源

2017-04-17 Molly Harper

什麼是實際問題？ – zvona

@zvona當else塊被執行時，它不應該顯示if塊代碼。我如何得到它不顯示if塊代碼？ –

例如，當this.props.tabLabel ==='completed'時只顯示else塊。現在，if塊在else塊顯示之前顯示幾秒鐘 –

我最終解決了這個問題。當頁面未完全加載時，if塊顯示。我在if語句中添加了一個this.props.loaded：

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

來源

2017-04-18 00:17:16

React Native條件呈現臨時顯示內容

回答

相關問題