React Native TypeError: undefined не является объектом (оценивается как _ref.item) - PullRequest
0 голосов
/ 23 мая 2019

Я пытаюсь сделать клон Instagram, но при использовании FlatList я получаю эту ошибку:

Ошибка: TypeError: undefined не является объектом (оценивается как _ref.item)

Я следовал этому учебнику на YouTube, и мой код в основном такой же, как и на видео, я думаю, что, вероятно, документы изменились из-за того, что видео было загружено 1 год назад.

enter image description here

Использование React Native Cli & android studio

import React, {Component} from "react";
import {FlatList} from "react-native";
import Post from "../presentation";

class PostFeed extends Component{

  _renderPost({ item }) {
    return <Post />;
  }

  _returnKey(item) {
    return item.toString();
  }

  render() {
    return (
      <FlatList
      data={[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]}
      keyExtractor={this._returnKey}
      renderItem={this._renderPost()}
    />
    );
  }
}

export default PostFeed;

Вот это InstaClone.js

import React, {Component} from "react";
import { View, Text, StyleSheet, Image, Dimensions, TouchableOpacity } from "react-native";
import config from "./config";
import { PostFeed } from './components/container';

class InstaClone extends Component {
  render() {
    return (
      <View style={{ flex: 1, width: 100+"%", height: 100+"%"}}>
          <View style={styles.tempNav}>
                <Text>Instagram</Text>
          </View>
          <PostFeed/>
      </View>
    );
  }
}

export default InstaClone;

const styles = StyleSheet.create({
    tempNav: {
      width:100+"%",
      height: 56,
      backgroundColor:"rgb(250,250,250)",
      borderBottomColor:"rgb(233,233,233)",
      borderBottomWidth: StyleSheet.hairlineWidth,
      justifyContent: "center",
      alignItems: "center"
    },
    userBar: {
      width:100+"%",
      height: config.styleConstants.rowHeight,
      backgroundColor: "#fff",
      flexDirection: "row",
      paddingHorizontal: 10,
      justifyContent: "space-between"

    },
    userPic: {
      height:40,
      width:40,
      borderRadius:20
    },

    iconBar: {
      height: config.styleConstants.rowHeight,
      width: 100 + "%",
      borderColor:"rgb(233,233,233)",
      borderTopWidth: StyleSheet.hairlineWidth,
      borderBottomWidth: StyleSheet.hairlineWidth,
      flexDirection: "row"
    },
    icon: {
      marginHorizontal: 5
    },

})

Ответы [ 2 ]

0 голосов
/ 23 мая 2019

Просто замените ваш код этим, и я думаю, что это решит проблему

  <FlatList
     data={[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]}
     keyExtractor={this._returnKey}
     renderItem={({ item }) => <View> {item} </View>}
 />
0 голосов
/ 23 мая 2019

Вы пытаетесь уничтожить «элемент» в аргументе _renderPost.Там нет переданного объекта, поэтому он жалуется.

...