경고 : React 네이티브 피커에서 React.createElement : 유형이 올바르지 않습니다.

Question

경고 : React.createElement : 유형이 잘못되었습니다 - 내장 된 구성 요소의 문자열 또는 예상되는 (구성 요소의) 정의되지 않았습니다. 정의 된 파일에서 구성 요소를 내보내는 것을 잊었을 가능성이 높습니다. AddCarScreen.js : 30에서 코드를 확인하십시오. ...

이 오류가 계속 발생하여 30 행에서 코드가 생성자에서 상태에 지정된 배열을 기반으로 동적으로 생성되는 선을 검사한다고 말합니다.

스타일을 다른 파일에서 올바르게 내 보내면 올바르게 가져올 수 있습니다. 그러면이 javascript 파일이 다른 파일의 중앙 서랍 네비게이터로 내보내집니다.

import React, { Component } from 'react'; 
import { Platform, StyleSheet, Text, View, Button, Picker } from 'react-native'; 
import styles from './StyleSheet.js'; 

export default class AddCarScreen extends Component { 
    constructor(props){ 
super(props) 

this.state = { 
    carBrand : "", 
    carBrandList : [ 'Ford', 'VW', 'Mazda' ] 
}; 

}

static navigationOptions = { 
     drawerLabel: 'Add Car', 
    } 



render() { 

const { navigate } = this.props.navigation; 

return(
    <View style = { styles.container }> 
    <Text style = { styles.screenTitle }> Add Car </Text> 
    <Picker 
     selectedValue = {this.state.carBrand} 
     onValueChange = {(itemValue) => this.setState({ carBrand: itemValue })}> 
     **{ this.state.carBrandList.map((item, index) => { return <Picker.item label = {item} value = {item} key = {index}/> }) }** 
    </Picker> 
    <Button 
     onPress = {() => navigate('DrawerOpen')} 
     title = "Menu" 
    /> 
    </View> 
    ); 
    } 
}; 

Answer 1

나는이 바닐라 피커와 현재의 버그라고 생각합니다. 나는 어느 쪽이라도 일하고있는지도를 얻을 수 없었다! 나는 또한 이와 비슷한 무수한 질문을 발견했다. 그 동안 나는 기다릴 수 없었고이 패키지와 .map이 작동 함을 발견했습니다. React-native-smart-picker.

   <ScrollView > 
       <View style={{ flex: 1, marginTop: 20 }}> 
        {this.state.models.length > 0 ? 
         <ScrollView > 
          <SmartPicker 

           expanded={this.state.expanded} 
           selectedValue={this.state.selectedModel} 
           label='Select Model' 
           onValueChange={this.handleChange.bind(this)} 
          > 
           { 
            this.state.models.map((ele) => { 
             return (<Picker.Item label={ele} value={ele} />) 
            }) 
           } 
          </SmartPicker> 
          <Button block onPress={() => this.props.vehicleModel(this.state.selectedModel)}> 
           <Text>Done</Text> 
          </Button> 
         </ScrollView> 
         : <Spinner />} 

       </View> 

      </ScrollView> 

Answer 2

피커를 변경해야합니다. 상품 to Picker. 항목은 공식 문서에서 그대로 : 나는 실제로 일반 선택기 구성 요소를 다시 시도하고 변수 'const를 PickerItem = Picker.Item'를 만든 맵 함수 내에서 대신 Picker.Item의 변수를 사용 https://facebook.github.io/react-native/docs/picker.html