当前位置:  开发笔记 > 编程语言 > 正文

如何在react-native中设置Alert元素的样式?

如何解决《如何在react-native中设置Alert元素的样式?》经验,为你挑选了2个好方法。

我正在使用react-native,我已经创建了一个Alert元素.

Alert.alert(
    'Warning',
    'bla bla bla',
    [
           {text: 'OK', onPress: () => console.log('OK Pressed')},
    ]
)

现在我想对它应用一些风格.假设我想将红色背景颜色和白色应用于文本.

我怎样才能做到这一点?可能吗?



1> Abdellah Ala..:

您可以使用自定义库,例如react-native-modalbox。

您将可以根据需要设置样式的样式:

        
          Basic modal
          

您可以使用以下方式打开模式

openModal1(id) {
    this.refs.modal1.open();
  }

查看示例以查看更多选项。

奖励:如果您想为react-native找到一个好的库,请尝试js.coach



2> 小智..:

实际上有一种方法可以自定义按钮上的文本,但是您只能使用提供的内容...以下是来自react native的类型定义.然后是一个显示红色按钮的简单示例.基本上"默认"是蓝色,"取消"是粗体但仍然是蓝色,"破坏性"是红色.

**
 * An Alert button style
*/
export type AlertButtonStyle = $Enum<{
/**
* Default button style
*/
'default': string,
/**
* Cancel button style
*/
'cancel': string,
/**
* Destructive button style
*/
'destructive': string,
}>;


Alert.alert("Look out!",
        "Hitting reset will wipe all the app's data on your phone. This cannot be undone!",
        [
        {text: 'Reset', onPress: this._doSomethingSerious, style: 'destructive'},
        {text: 'Cancel'},
        ],
        {cancelable: false}
    )

推荐阅读
Life一切安好
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有