如何控制組件的外觀反應本土

Question

我想控制Text組件

的出現在我的代碼Text組件只只有當特定Image呈現

這似乎Text組件應該在特定的Image出現後5秒後可見

我該怎麼做這裏是我的示例代碼：基於您的評論

renderImage1() { 
 
    return (
 
     <Image 
 
     source={require('./Images/image1.png')} 
 
     style={styles.image1Style} > 
 
     <Text   // I need to control this component's appearance 
 
     style={styles.textStyle} 
 
     onPress={() => this.setStep(2)}> 
 
     Touch To Play 
 
     </Text> 
 
     </Image> 
 
    ); 
 
    }

Answer 1

：

現在它呈現兩個我想要的是顯示圖像，然後經過約5秒鐘顯示文本給用戶

我可以建議：
1.試試使用this.state來創建顯示道具，它將使用布爾值（用於if語句）或「none」/「初始」值（用於顯示文本樣式道具）或「visibile」/「隱藏」值（用於能見度文字風格道具）。
2.在this.setState（{showText：！showText}）函數調用上設置timeout。
3.對於if語句解決方案使您的渲染方法渲染圖像與文本或無基於this.state.display真實性或虛假。

render() { 
    if (this.state.display) { 
     return <Image><Text></Text></Image> 
    } 
    return <Image></Image> 
} 

對於顯示或能見度soltions使用ternary opertor您的文本組件的在其樣式display/visibility之間波動：

顯示：

<Text 
    style={{ display: this.state.display }) 
/> 

能見度：

<Text 
    style={{ visibility: this.state.visibility }) 
/>