RNのModalの問題の解決策
3458 ワード
前言:
私は現在、スマートランプの企業でRNの開発をしています.最近テストでバグが何回も提出されましたが、どうしてこんなにバグが多いのか分かりません.私はまずメールを注文してよく見てみると、いくつかの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 (
sadasdsa
)
}
}
const styles = StyleSheet.create({
modal: {
justifyContent: 'center',
alignItems: 'center'
},
modal1: {
height: 230,
backgroundColor: "#3B5998",
zIndex:9999
},
})
export default ModalText
では、このような遅延ソリューションもだめですが、私たちのビジネスニーズでは、このような急速なModalの状態切り替えが発生する可能性があります.では公式帯のModalは使えなくなり、第三者のModalを求め始めました
2つのModalが選択できることが分かったので、上記のコードで2つのModalをテストし続けます.
react-native-modal
react-native-root-modal
最初のModalでは、データとビューが一致しないBugが発生し、最終的にreact-native-root-modalをテストしても問題ありません.思い切って全部新しいModalに置き換えて