React Native 中的 Picker.Item 组件的 label 属性

返回上一级

React Native 中的 Picker.Item 组件的 label 属性用于设置 Picker.Item 要显示的文本

需要注意的是,这个属性只有两个作用

  1. 当前选项被选中时,会作为 Picker 的显示文本
  2. 作为当前选项的显示文本

也就是说,Picker.Item 其实就相当于 HTML<select> 标签中的 <option> 标签的开始标签和结束标签中的文本,比如 <option>简单教程</option> 中的 “简单教程”

label 属性的值

因为该属性的值是 Props.any ,所以该属性的值有两种形式

  1. 纯文本,可以是字符串或者整型
  2. 其它组件

导入模块

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>

返回上一级

React Native 中文文档

关于   |   FAQ   |   我们的愿景   |   广告投放   |  博客

  简单教程,简单编程 - IT 入门首选站

Copyright © 2013-2022 简单教程 twle.cn All Rights Reserved.