0

我正在使用本机 API 将数据显示到FlatList中，不幸的是出现以下错误：

错误：元素类型无效：应为字符串。

到目前为止，我已经完成了以下工作：

import React, { Component } from "react";
import { View, Text, FlatList,List } from "react-native";
// import {Row} from './Row';

export default class FlatListDemo extends Component {
  constructor(props) {
    super(props);

    this.state = {
      loading: false,
      data: [],
      page: 1,
      seed: 1,
      error: null,
      refreshing: false,
    };
  }

  componentDidMount() {
    this.makeRemoteRequest();
  }

  makeRemoteRequest = () => {
    const { page, seed } = this.state;
    const url = `https://randomuser.me/api/?seed=${seed}&page=${page}&results=20`;
    this.setState({ loading: true });
    fetch(url)
      .then(res => res.json())
      .then(res => {
        this.setState({
          data: page === 1 ? res.results : [...this.state.data, ...res.results],
          error: res.error || null,
          loading: false,
          refreshing: false
        });
      })
      .catch(error => {
        this.setState({ error, loading: false });
      });
  };

  render() {
    return (
      <View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
         <List>
      <FlatList
        data={this.state.data}
        renderItem={({ item }) => (
          <ListItem
            roundAvatar
            title={`${item.name.first} ${item.name.last}`}
            subtitle={item.email}
            avatar={{ uri: item.picture.thumbnail }}
          />
        )}
         keyExtractor={item => item.email}
      />
    </List>
      </View>
    );
  }
}

所以，我从过去两个小时开始尝试解决，但堆积在那里。可能是什么问题？

4

1 回答 1

1

从您的代码中删除列表组件并尝试。

于 2018-07-24T12:40:17.720 回答