import * as React from "react";
import { Text, View, StyleSheet } from "react-native";
import Constants from "expo-constants";

// You can import from local files
import DropDownPicker from "react-native-dropdown-picker";

export default function App() {
  return (
    <View style={styles.container}>
      <Text style={styles.paragraph}>React native dropdown picker</Text>
      <DropDownPicker
        items={[
          { label: "English", value: "en" },
          { label: "Deutsch", value: "de" },
          { label: "French", value: "fr" },
        ]}
        defaultIndex={0}
        containerStyle={{ height: 40 }}
        onChangeItem={(item) => console.log(item.label, item.value)}
      />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    paddingTop: Constants.statusBarHeight,
    backgroundColor: "#ecf0f1",
    padding: 8,
  },
  paragraph: {
    margin: 24,
    fontSize: 18,
    fontWeight: "bold",
    textAlign: "center",
  },
});

문제상황

dropdown-pick 에서 사진처럼 값을 선택할 수 가 없음.

문제해결

"dependencies": {
    "react-native-dropdown-picker": "2.2.1",
  }

을 명시해주고 npm install 후 재실행 시키면 해결됨.

리뷰

expo는 아직 라이브러리가 안정적이진 않는거 같다. 프로젝트 진행하면서 라이브러리 버전 문제로 고생하고 있다.