大佬教程收集整理的这篇文章主要介绍了React Native 弹窗(二)Modal.alert (Ant Design Mobile RN),大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
之前谈到过项目中的弹窗使用系统的Alert的局限性,
那么在Ant Design Mobile RN这个三方库中,
使用Modal.alert自定义了alert(本质就是使用Modal自定义alert,和系统的Alert没有任何关系,仅仅是看起来相似而已),灵活了很多,可以进行UI的定制
Modal.alert
效果如图:
API
Modal.alert(title, message, actions?, platform?)
我们可以发现title, message不止支持String,亦支持组件React.Element,即可以自定义标题和消息,
按钮可以通过style自定义
actions Action
export interface Action<T = TextStyle> { text: string; onPress?: () => void | Promise<any>; style?: T | string; }
项目实际使用
如图效果:
代码如下:
Modal.alert('我是标题', '我是内容我是内容', [{text: '知道了',onPress: () => {},style: 'cancel'}])
综上所述:
Ant Design Mobile RN的Modal.alert已经封装的比较灵活了,标题、内容、按钮都可以自定义样式,但也仅限于此
但是当我们要改变弹框位置或者大小或者出现方式的时候,就只能自定义了
官方文档:
https://rn.mobile.ant.design/components/modal-cn/
以上是大佬教程为你收集整理的React Native 弹窗(二)Modal.alert (Ant Design Mobile RN)全部内容,希望文章能够帮你解决React Native 弹窗(二)Modal.alert (Ant Design Mobile RN)所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。