Möchten Daten an andere Komponente übergeben - ListView

Question

Ich habe hinzugefügt und importiert sample data. Ich möchte Daten aus dieser Datei in einer list view auflisten und ich übergebe die Daten an die Row-Komponente für RenderRow. Aber Fehlermeldung

Zeile (...): Ein gültiges React-Element (oder null) muss zurückgegeben werden. Möglicherweise sind Sie undefined, ein Array oder ein anderes ungültiges Objekt zurückgegeben worden.

import React, { Component } from 'react'; 
import { AppRegistry, View, ListView, Text, StyleSheet } from 'react-native'; 
import Row from './app/Row'; 
import data from './app/Data'; 

export default class ListViewDemo extends Component { 
    constructor(props) { 
    super(props); 
    const rowHasChanged = (r1, r2) => r1 !== r2 
    const ds = new ListView.DataSource({rowHasChanged}); 
    this.state = { 
    dataSource: ds.cloneWithRows(data), 
    }; 
    render() { 
    return (
    <ListView 
     dataSource={this.state.dataSource} 
     renderRow={(data) => <Row {...data} />} // Getting error here 
    /> 
    ); 
    } 
} 
AppRegistry.registerComponent('DemoApp',() => ListViewDemo) 

sind meine Probe data.js können Sie die data here überprüfen.

export default data = [ 
    {...}, {...} 
]; 

Row.js:

const Row = (props) => { 
<View Style={styles.container}> 
    <Image source={{ uri: props.picture.large}} /> 
    <Text > 
    {`${props.name.first} ${props.name.last}`} 
    </Text> 
</View> 
} 

Was würde das Problem sein?

Answer 1

ES6 nur zurück zu bekommen, wenn es keine explizite Blöcke:

const cb = (param) => param * 2; 

Sie sollten ausdrücklich zurück:

const Row = (props) => { 
    return (
     <View Style={styles.container}> 
      <Image source={{ uri: props.picture.large}} /> 
      <Text > 
       {`${props.name.first} ${props.name.last}`} 
      </Text> 
     </View> 
    ); 
} 

prüfen diese answer für weitere Erläuterungen.

Answer 2

Ändern Sie diese Zeile zu

renderRow={(data) => <Row {...data} />} 

Zu diesem

renderRow={(data) =><Row {...this.props} />} 

Dies kann Ihnen helfen, Requisiten in der Reihe Component