在警报消息如何插入断行的反应,本机真棒的警报

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在警报消息如何插入断行的反应,本机真棒的警报相关的知识,希望对你有一定的参考价值。

我用我的代码反应母语 - 真棒的警报。在警报消息,我想文打入一个新行

它应该像下面的图片

alert

请帮我该怎么办呢

这里是我的代码

import React,  Component  from 'react';
import  StyleSheet, View, Text, TouchableOpacity  from 'react-native';
import AwesomeAlert from 'react-native-awesome-alerts';

export default class Alert extends Component 

  constructor(props) 
    super(props);
    this.state =  showAlert: false ;
  

  showAlert = () => 
    this.setState(
      showAlert: true
    );
  ;

  hideAlert = () => 
    this.setState(
      showAlert: false
    );
  ;

  render() 
    const  showAlert  = this.state;

    return (
      <View style=styles.container>

        <Text>I'm AwesomeAlert</Text>
        <TouchableOpacity onPress=() => 
          this.showAlert();
        >
          <View style=styles.button>
            <Text style=styles.text>Try me!</Text>
          </View>
        </TouchableOpacity>

        <AwesomeAlert
          show=showAlert
          showProgress=false
          message='Incorrect Username/Password Used“\n”Please try again…'
          messageStyle=styles.textStyle
          closeOnTouchOutside=true
          closeOnHardwareBackPress=false
          contentContainerStyle=styles.alertStyle
        />
      </View>
    );
  


const styles = StyleSheet.create(
  container: 
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#fff',
  ,
  button: 
    margin: 10,
    paddingHorizontal: 10,
    paddingVertical: 7,
    borderRadius: 5,
    backgroundColor: '#AEDEF4',
  ,
  text: 
    color: '#fff',
    fontSize: 15
  ,
  alertStyle: 
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'white', 
    height: 100,
    width: '60%',
    borderWidth: 1,
    borderColor: '#fff',
    borderRadius: 7,
    color: 'red'
  ,
  textStyle: 
      fontSize: 14,
      color: 'black',
      alignItems: 'center'
  

);

我曾尝试“二手‘\ n’错误的用户名/密码,请再试一次...”,但仍然没有运气

请让我知道它是怎么了?

答案

您需要将您的消息字符串改为使用反引号`,并添加\ n。这应该现在的工作。

message=`Incorrect Username/Password Used \n Please try again…`

您也可以在容器宽度更改为80%,并添加textAlign:"centre"到TEXTSTYLE CSS,使得它看起来更好。

以下是我设法生产:

enter image description here

以上是关于在警报消息如何插入断行的反应,本机真棒的警报的主要内容,如果未能解决你的问题,请参考以下文章

如何检测是不是在本机反应中显示警报?

无法在javascript反应中更改警报消息的颜色

发出警报后,我无法在我的反应本机应用程序中关闭我的键盘

如何在一行上制作 Javascript 警报代码

jQuery - 如何在显示警报消息后阻止表单发布数据?

如何在按钮单击 React.js 时运行警报