跳到主要内容
版本：Next

Button

一个基础按钮组件，应能在任何平台上良好呈现。支持最基本程度的自定义。

如果此按钮不适合你的应用，可以使用 Pressable 自行构建按钮。你可以参考 Button 组件的源代码。

React TSX
<Button
  onPress={onPressLearnMore}
  title="了解更多"
  color="#841584"
  accessibilityLabel="了解有关这个紫色按钮的更多信息"
/>

示例​

参考

属性​

必需
onPress​

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

Type
({nativeEvent: PressEvent})

必需
title​

显示在按钮内部的文本。在 Android 上，给定的标题会转换为大写形式。

Type
string

accessibilityLabel​

为无障碍辅助功能显示的文本。

Type
string

accessibilityLanguage
iOS
​

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

有关更多信息，请参阅 iOS accessibilityLanguage 文档。

Type
string

accessibilityActions​

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

有关更多信息，请参阅 无障碍指南。

TypeRequired
arrayNo

onAccessibilityAction​

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

有关更多信息，请参阅 无障碍指南。

TypeRequired
functionNo

color​

文本颜色（iOS）或按钮背景颜色（Android）。

TypeDefault
color '#2196F3'
Android
'#007AFF'
iOS

disabled​

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

TypeDefault
boolfalse

hasTVPreferredFocus
TV
​

TV 首选焦点。

TypeDefault
boolfalse

nextFocusDown
Android
TV
​

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

Type
number

nextFocusForward
Android
TV
​

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

Type
number

nextFocusLeft
Android
TV
​

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

Type
number

nextFocusRight
Android
TV
​

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

Type
number

nextFocusUp
Android
TV
​

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

Type
number

testID​

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

Type
string

touchSoundDisabled
Android
​

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

TypeDefault
booleanfalse