React Native 中的 Picker.Item 组件的 label 属性
React Native 中的 Picker.Item 组件的 label 属性用于设置 Picker.Item 要显示的文本
需要注意的是,这个属性只有两个作用
- 当前选项被选中时,会作为 Picker 的显示文本
- 作为当前选项的显示文本
也就是说,Picker.Item
其实就相当于 HTML 中 <select>
标签中的 <option>
标签的开始标签和结束标签中的文本,比如 <option>简单教程</option>
中的 “简单教程”
label 属性的值
因为该属性的值是 Props.any
,所以该属性的值有两种形式
- 纯文本,可以是字符串或者整型
- 其它组件
导入模块
import {Picker} from 'react-native'
使用语法
<Picker> <Picker.Item label="简单教程" value="https://www.twle.cn" /> </Picker>
范例
下面的代码,我们为 Picker 的每一个选项 Picker.Item 设置 label 属性
<Picker selectedValue={'https://www.twle.cn/'} onValueChange={(itemValue, itemIndex) => this.setState({language: itemValue})}> <Picker.Item label="Java" value="java" /> <Picker.Item label="JavaScript" value="js" /> <Picker.Item label="简单教程" value="https://www.twle.cn/" /> </Picker>