与原生基础和react- native -modal有冲突吗?我无法让我的模式显示内容。我想知道是不是因为原生基础的容器标签。
发布于 2019-07-09 13:33:37
你也可以从react原生组件中使用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'
},
});如果你在这方面遇到问题,试一下,让我知道。
发布于 2019-10-02 20:56:25
我也遇到过同样的问题。只需从Modal样式中删除flex:1,您最终将得到没有任何样式的居中模式。然后你需要自己设置模式的所有样式。
https://stackoverflow.com/questions/56941252
复制相似问题