这就是我要做的,基本上,单击Open Modal
按钮打开模态,然后单击模态内的Close Modal
按钮将其关闭。下面两张图片是两种情况的样子。
这是我的代码:
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
showModal: false
};
}
componentWillUpdate() {
if(PlatForm.OS === 'android') {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
LayoutAnimation.easeInEaseOut();
}
render() {
return (
<View style={{ ... }}>
<TouchableOpacity onPress={() => this.setState({ showModal: true })}>
<Text style={{ ... }}>
Open Modal
</Text>
</TouchableOpacity>
<Modal visible={this.state.showModal} animationType='slide'>
<View style={{ ... }}>
<TouchableOpacity onPress={() => this.setState({ showModal: false })}>
<Text style={{ color: 'white', fontSize: 20 }}>
Close Modal
</Text>
</TouchableOpacity>
</View>
</Modal>
</View>
);
}
}
在IOS模拟器上运行时,一切都按预期工作,但在iPhone上运行时问题会增加。当按Close Modal
时,模态会消失半秒钟,然后再次重新打开,这次,Close Modal
按钮将无效,我无法重新关闭模态。我所能做的就是重建项目。但是,当我删除componentWillUpdate()
时,它会再次运行,无论是在模拟器上还是在iPhone上
答案 0 :(得分:1)
我相信这是最近版本的React Native中引入的错误。目前,您最好的选择是禁用LayoutAnimation。不太理想......我知道。
请参阅Github上的讨论:https://github.com/facebook/react-native/issues/16182