在 android 上的 react-native 中使用 <List> 和 <FlatList> 时出现不变冲突错误

Question

我正在使用将一些内容呈现为列表，在 react-native 中使用和。这是我的代码。

import React, { Component } from 'react';
import { Text, View, FlatList, StyleSheet, TextInput } from 'react-native';
import { Card, List, ListItem, Button, Icon, Image } from 'react-native-elements';
import { fb, database } from '../../../config/config';

export default class Vehicles extends Component {
  constructor (props) {
    super(props);
    this.state = {
      v_number: '',
      v_brand: '',
      v_type: '',
      user: null,
      v_list: []
    };
  }

  render () {
    return (
      <View style={styles.vehicleContainer}>
        <Button
          title=" Logout"
        />
        {
          this.state.v_list != null ? (
            <List>
              <FlatList
                data={this.state.v_list}
                renderItem={({ item }) => (
                  <ListItem
                    roundAvatar
                    title={item.details.vehicle_number}
                    subtitle={item.details.vehicle_type}
                    leftAvatar={{ source: { uri: 'https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg' } }}
                  />
                )}
              />
            </List>
          ) : (
            <Text>Empty</Text>
          )
        }
      </View>
    );
  }
}

const styles = StyleSheet.create({
  vehicleContainer: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#ffffff'
  },
  ti1: {
    borderColor: 'gray',
    borderWidth: 1,
    width: 300,
    height: 40
  }
});

执行此代码后出现两个错误。第一个是，

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s, undefined,
 You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

第二个错误是，

Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

当我使用 and 时，它正在工作。但是当我使用 and 时，我遇到了这些错误。我该如何解决这个问题？

（我已经实现了从 firebase 获取数据并将这些数据分配给状态中的 v_list 的相关方法。我没有在此处包含这些方法。它们工作正常。）

Answer 1

检查您的 react-native-elements.

版本

这个错误通常是由于导入了不存在的东西造成的。

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s, undefined,
You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

在版本 1+ 中，组件 List 已被弃用。您可以通过检查依赖项的 blog. Also several props for ListItem were also deprecated, you can see which ones here.

来详细了解已弃用的内容和未弃用的内容

您正在使用 List 和 roundAvatar 这一事实表明您可能正在尝试使用版本 0.19.1 中的组件，但安装了版本 1+。

在 android 上的 react-native 中使用 <List> 和 <FlatList> 时出现不变冲突错误

getting Invariant Violation error when using <List> and <FlatList> in react-native on android

react-native

react-native-elements