RN0.54以上安卓中display: none 和 position: absolute不能同时使用

前言

只是记录一下，说不上是什么分享吧，也是最近reactNative项目遇到的问题。场景是这样的。我用react-native0.51的时候，display:none可以正常使用，升级到0.58之后，不能用了。查阅了一下资料，RN0.54以上，安卓手机爆出的问题，在display: none 和 position: absolute同时使用的时候，display:none无效。

解决方案一：

解决方案很简单，就是在display:none的时候把position:absolute变成position:relative就可以了。

if (haorooms_hidden) {
setState({display: none, position: relative})
} else {
setState({display: flex, position: absolute } )
}

具体可以看 https://github.com/facebook/react-native/issues/18415

解决方案二

假如你隐藏需要一些效果，或者动画之类的，可以使用插件

react-native-display

用法：

import Display from 'react-native-display';

<Display enable={this.state.enable}>
  <Text> My custom components </Text>
</Display>

添加动画

 <Display 
            enable={this.state.enable} 
            enterDuration={500} 
            exitDuration={250}
            exit="fadeOutLeft"
            enter="fadeInLeft"
          >
            <View style={[styles.circle, {backgroundColor: '#2ecc71'}]} />
          </Display>

小结

本文主要是记录react-native新版本 中display：none无效的这个bug，说不定后面就会修复了。