Button
一个简单的跨平台的按钮组件。可以进行一些简单的定制。
这个组件的样式是固定的。所以如果它的外观并不怎么搭配你的设计,那你需要使用TouchableOpacity
或是TouchableNativeFeedback
组件来定制自己所需要的按钮,或者你也可以在 github.com 网站上搜索 'react native button' 来看看社区其他人的作品。
import { Button } from 'react-native';
...
<Button
onPress={onPressLearnMore}
title="Learn More"
color="#841584"
accessibilityLabel="Learn more about this purple button"
/>
示例
文档
Props
必需onPress
用户点击此按钮时所调用的处理函数
类型 |
---|
({nativeEvent: PressEvent}) |
必需title
按钮内显示的文本
类型 |
---|
string |
accessibilityLabel
用于给残障人士显示的文本(比如读屏应用可能会读取这一内容)
类型 |
---|
string |
accessibilityActions
Accessibility actions allow an assistive technology to programmatically invoke the actions of a component. The accessibilityActions
property should contain a list of action objects. Each action object should contain the field name and label.
See the Accessibility guide for more information.
Type | Required |
---|---|
array | No |
onAccessibilityAction
Invoked when the user performs the accessibility actions. The only argument to this function is an event containing the name of the action to perform.
See the Accessibility guide for more information.
Type | Required |
---|---|
function | No |
color
文本的颜色(iOS),或是按钮的背景色(Android)
类型 |
---|
color |
disabled
设置为 true 时此按钮将不可点击。
类型 | 必需 |
---|---|
bool | 否 |
testID
用来在端到端测试中定位 此视图。
类型 | 必需 |
---|---|
string | 否 |
hasTVPreferredFocus
(Apple TV only) TV preferred focus (see documentation for the View component).
类型 | 必需 | 平台 |
---|---|---|
bool | 否 | iOS |
nextFocusDown
Designates the next view to receive focus when the user navigates down. See the Android documentation.
类型 | Required | 平台 |
---|---|---|
number | No | Android |
nextFocusForward
Designates the next view to receive focus when the user navigates forward. See the Android documentation.
类型 | Required | 平台 |
---|---|---|
number | No | Android |