推荐开源项目:React Native Dropdown Picker
    		       		warning:
    		            这篇文章距离上次修改已过437天,其中的内容可能已经有所变动。
    		        
        		                
                React Native Dropdown Picker 是一个为 React Native 应用设计的下拉选择器组件。它提供了一个简单的接口来创建一个可定制的下拉菜单,用户可以从中选择一个或多个选项。
以下是如何使用该项目的基本步骤:
- 安装库:
 
npm install @react-native-community/picker react-native-dropdown-picker- 在你的 React Native 代码中导入并使用:
 
import React, { useState } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import DropdownPicker from 'react-native-dropdown-picker';
 
const App = () => {
  const [selectedItem, setSelectedItem] = useState(null);
 
  return (
    <View style={styles.container}>
      <DropdownPicker
        items={[
          { label: 'Iron Man', value: 'ironman' },
          { label: 'Captain America', value: 'captainamerica' },
          { label: 'Thor', value: 'thor' },
        ]}
        defaultValue={selectedItem}
        onChangeItem={item => setSelectedItem(item.value)}
      />
    </View>
  );
};
 
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    padding: 20,
  },
});
 
export default App;在这个例子中,我们创建了一个简单的下拉选择器,列出了三个英雄作为选项,并且使用了一个状态变量 selectedItem 来存储当前选中的值。当用户选择一个选项时,onChangeItem 回调会被触发,并更新 selectedItem 的值。
评论已关闭