Question

警告：React.createElement：type无效 - 期望一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：undefined。您可能忘记从其定义的文件中导出组件。检查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

您应该将Picker。项目更改为Picker。项目，因为它位于官方文档：https://facebook.github.io/react-native/docs/picker.html

Answer 2

我认为这是vanilla Picker的当前错误。我也无法获得地图工作！我也发现了类似的无数问题。与此同时，我无法等待，发现这个包和.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>

警告：React.createElement：使用React Native Picker

2 个答案: