跳到主要内容
版本：0.84

按钮

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

如果这个按钮在你的应用中看起来不合适，你可以使用 Pressable 来构建你自己的按钮。想要获取灵感，可以查看 按钮组件的源码。

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

示例​

参考

属性​

必需
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
​

电视上的首选聚焦。

类型默认
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