跳到主要内容
版本:0.77

Button

一个基本的按钮组件,应在任何平台上都能良好渲染。支持最低程度的自定义。

如果此按钮不适合您的应用,您可以使用 Pressable 构建自己的按钮。如需灵感,请参阅 Button 组件的源代码。

React TSX
<Button
onPress={onPressLearnMore}
title="Learn More"
color="#841584"
accessibilityLabel="Learn more about this purple button"
/>

示例​


参考

属性​

必需
onPress​

当用户点击按钮时调用的处理函数。

类型
({nativeEvent: PressEvent})

必需
title​

按钮内显示的文本。在 Android 上,给定的标题将被转换为大写形式。

类型
string

accessibilityLabel​

为盲人无障碍功能显示的文本。

类型
string

accessibilityLanguage
iOS
​

一个值,指示屏幕阅读器在用户与元素交互时应使用哪种语言。它应遵循 BCP 47 规范。

请参阅 iOS accessibilityLanguage 文档 以获取更多信息。

类型
string

accessibilityActions​

无障碍操作允许辅助技术以编程方式调用组件的操作。accessibilityActions 属性应包含一个操作对象列表。每个操作对象应包含字段 name 和 label。

请参阅 无障碍指南 以获取更多信息。

类型必需
array否

onAccessibilityAction​

当用户执行无障碍操作时调用。此函数的唯一参数是一个包含要执行的操作名称的事件。

请参阅 无障碍指南 以获取更多信息。

类型必需
function否

color​

文本颜色(iOS),或按钮的背景颜色(Android)。

类型默认值
color '#2196F3'
Android

'#007AFF'
iOS

disabled​

如果为 true,则禁用此组件的所有交互。

类型默认值
boolfalse

hasTVPreferredFocus
TV
​

TV 首选焦点。

类型默认值
boolfalse

nextFocusDown
Android
TV
​

指定用户向下导航时接收焦点的下一个视图。请参阅 Android 文档。

类型
number

nextFocusForward
Android
TV
​

指定用户向前导航时接收焦点的下一个视图。请参阅 Android 文档。

类型
number

nextFocusLeft
Android
TV
​

指定用户向左导航时接收焦点的下一个视图。请参阅 Android 文档。

类型
number

nextFocusRight
Android
TV
​

指定用户向右导航时接收焦点的下一个视图。请参阅 Android 文档。

类型
number

nextFocusUp
Android
TV
​

指定用户向上导航时接收焦点的下一个视图。请参阅 Android 文档。

类型
number

testID​

用于在端到端测试中定位此视图。

类型
string

touchSoundDisabled
Android
​

如果为 true,则在触摸时不播放系统声音。

类型默认值
booleanfalse