前言：
本人目前在一家智能灯的企业做RN的开发。最近测试提交了好几BUG，莫名其妙的怎么会这么多BUG。
我先点开邮件仔细看了一下，发现好几个BUG相同的点都是类似压力测试，然后App莫名的就崩掉了。
那先复现一下BUG,再想办法解决！！！
正文:
先打个测试包BUG复现一下看看报的什么错**
java.lang.NullPointerException: Attempt to invoke virtual method 'void com.facebook.react.uimanager.ReactShadowNode.setStyleWidth(float)' on a null object reference
好吧，好像经过我的测试后都是这一个问题。来解决问题。google发现有人遇到了这个问题 请戳这里
。这个问题的是过快的切换Modal的状态，导致程序奔溃。这怎么办呢？
既然是过快的切换，那么我加个延迟会如何呢类似这样：
setTimeout(()=>{
this.setState({
isOpen:true
})
},100)
这样就不会出问题了吧，我先测试高配的手机，没有问题！当我拿起配置低的手机的时候发现多次测试后还是会有几率奔溃，
测试的代码是这样的：
import React, {Component, PropTypes} from 'react'
import {View,Text,StyleSheet,TouchableOpacity,Modal} from 'react-native';
//import Modal from 'react-native-modalbox';
class ModalText extends Component {
constructor (props) {
super(props)
this.state={
swipeToClose: false,
isOpen:true
}
this.SetTimeName = 0;
}
onClose() {
console.log('Modal just closed');
}
onOpen() {
console.log('Modal just openned');
}
onClosingState(state) {
console.log('the open/close of the swipeToClose just changed');
}
componentDidMount () {
let thiRef = this;
this.SetTimeName = setInterval(()=>{
if(this.state.swipeToClose==false){
this.setState({
swipeToClose:true
})
this.refs.modal1.open();
}else{
this.setState({
swipeToClose:false
})
this.refs.modal1.open();
}
},500)
setTimeout(()=>{
clearInterval(thiRef.SetTimeName)
},10000)
this.refs.modal1.open();
}
render () {
return (
<View style={{flex:1}}>
<View style={{width:300,height:300,backgroundColor:"red",zIndex:0}}>
<TouchableOpacity style={{flex:1}} onPress = {alert("dsds")}></TouchableOpacity>
</View>
<Modal
style={[styles.modal, styles.modal1]}
ref={"modal1"}
swipeToClose={this.state.swipeToClose}
onClosed={this.onClose}
onOpened={this.onOpen}
isOpen = {this.state.isOpen}
backdropPressToClose = {false}
onClosingState={this.onClosingState}>
<View style={{width:100,height:100,backgroundColor:'#FFF',zIndex:10000}}><Text>sadasdsa</Text></View>
</Modal>
</View>
)
}
}
const styles = StyleSheet.create({
modal: {
justifyContent: 'center',
alignItems: 'center'
},
modal1: {
height: 230,
backgroundColor: "#3B5998",
zIndex:9999
},
})
export default ModalText
那么看来这种延迟的解决方案也是不行的，然而我们的业务需求，大概率的发生这种快速的Modal的状态切换。
那么官方带的Modal是不能用了，我们开始寻求第三方的Modal
发现两个Modal可以选择的,继续以上面一段代码测试这两个Modal。
react-native-modal
react-native-root-modal
第一个Modal会出现数据和视图变现不一致的Bug，最终测试react-native-root-modal没有问题。果断全部替换为新的Modal
