如何创建闪烁的反应视图答案

【问题标题】：How to create a blinking react View如何创建闪烁的反应视图
【发布时间】：2019-09-10 22:11:01
【问题描述】：

有人可以帮我看看如何创建一个可以闪烁的 react-native 组件吗？

所以基本上，这就是我所做的

class Blinkable extends PureComponent {

state = {
    blinkComponentVisibility: false
 }  

 blink () {
        this.setState({blinkComponentVisibility: !  blinkComponentVisibility})
        console.log(this.state)
     }

    componentDidMount = () => {
        setTimeout(() => {this.blink}, 3000)
    }

render () {
  if (i === currentProgress) {
            if (this.state.blinkComponentVisibility) {
            progressBarArray.push(
                <View
                style={{
                    width: widthOfIndividualBlog,
                    backgroundColor: colorOfProgressBar,
                    height: heightOfProgressBar
                }}
                key={i}
            ></View>)
  }
}



return (
            <View>

                <View style={{display: 'flex', flexDirection: 'row'}}>{progressBarArray}</View>
            </View>
        )
    }
}

使用上面的代码，我希望我的组件会闪烁，但什么也没发生，而是我在控制台中看到以下日志

RCTLog.js:47 找不到带有标签 #363 的阴影视图，这是可能是由于本地视图和本地视图之间的暂时不一致造成的阴影视图

有人可以帮我弄清楚我做错了什么吗？

【问题讨论】：

标签： reactjs react-native

【解决方案1】：

this.setState({blinkComponentVisibility: ! blinkComponentVisibility}) 应该是this.setState({blinkComponentVisibility: ! this.state.blinkComponentVisibility})

在你设置的超时时间里你需要调用函数

setTimeout(() => this.blink(), 3000)

【讨论】：