javascript - setTimeout 方法内的渲染组件不起作用

Question

我正在尝试以一定的延迟渲染组件，并且我想使用 setTimeout() (并不是说它必须使用该方法，但我不知道其他方法)，我不知道为什么，我一定做错了，但它只是不会渲染组件

代码:

      <View>
        <Image 
          source={require('./assets/img/1.gif')} 
        />
          {
            setTimeout(() => {
              return (
                <Text>some text</Text>
              )
            }, 5000)
          }            
      </View>   

Answer 1

你可以尝试这样的事情:

constructor(props) {
 super(props)
 this.state = {
  showText: false
 }
}

componentDidMount() {
 setTimeout(() => {
   this.setState({ showText: true })
 }, 5000)
}

render() {
 const { showText } = this.state

 return (
  <div>
   <Image source={require('./assets/img/1.gif')} />
   {showText && <Text>some text</Text>}
  </div>
 )
}