[英]Native Base and Modal not working in React Native
Is there any conflict with native base and react-native-modal?与 native base 和 react-native-modal 有冲突吗? I can't get my modal to display the content.
我无法让我的模式显示内容。 I was wondering if it is because the Container tag of native base.
我想知道是不是因为原生 base 的 Container 标签。
Code: https://snack.expo.io/rJbAI_Cxr代码: https : //snack.expo.io/rJbAI_Cxr
You can use Modal from react native component also ,no need to use third party library.您也可以使用 React Native 组件中的 Modal,无需使用第三方库。
import {Modal} from 'react-native';
constructor(props) {
super(props);
this.state = {
modalVisibility: false,
};
ShowModalFunction(visible) {
this.setState({ modalVisibility: visible });
}
<Modal
transparent={true}
animationType={"slide"}
visible={this.state.modalVisibility}
onRequestClose={() => { this.ShowModalFunction(!this.state.modalVisibility) }} >
<View style={{ flex:1, justifyContent: 'center', alignItems: 'center' }}>
<View style={styles.ModalInsideView}>
<Text style={{color:'white',fontSize:14,fontWeight:'700'}}>Hello </Text>
</View>
</View>
</Modal>
const styles = StyleSheet.create({
ModalInsideView:{
justifyContent: 'center',
alignItems: 'center',
backgroundColor : "#00BCD4",
height: 245 ,
width: '90%',
borderRadius:10,
borderWidth: 1,
borderColor: '#fff'
},
});
Try this if you face issue in this ,let me know.如果您在这方面遇到问题,请尝试此操作,让我知道。
I've had the same issue.我有同样的问题。 just remove the
flex:1
from Modal
style and you will end up with centered modal without any style.只需从
Modal
样式中删除flex:1
,您就会得到没有任何样式的居中模态。 Then you need to set all the styles for the modal by yourself.然后你需要自己设置模态的所有样式。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.