列表視圖數據源錯誤 - 陣營母語

Question

Hi, 
Please checkout my code below 

'use strict'; 
var React = require('react-native'); 
var Dimensions = require('Dimensions'); 
var windowSize = Dimensions.get('window'); 

var { 
    AppRegistry, 
    Component, 
    StyleSheet, 
    Text, 
    View, 
    AsyncStorage, 
    Alert, 
} = React; 

var api = require('./api.js'); 
var Row = require('./Row'); 

var Projects = React.createClass({ 
    getInitialState: function() {  
    var ds = new ListView.DataSource({ rowHasChanged: (row1, row2) => row1 !== row2, }); 
    return {  
     dataSource: ds, 
     loaded: false, 
     noData: false, 
    } 
    }, 

    componentDidMount: function() { 
    this.fetchData(); 
    }, 

    fetchData: function() { 
     fetch(api.url+"projects/"+this.props.token+"/", { 
      headers: { 'Accept': 'text/json', 'Content-Type': 'text/json', }, 
     }) 
     .then((response) => response.json()) 
     .then((responseData) => { 
      //Alert.alert('projects response', JSON.stringify(responseData)); 
      if(responseData.type == 'success'){ 

       if(responseData.result.length > 0){ 
        this.setState({ 
         loaded: false, 

        }); 
       }else{ 
        this.setState({ 
         loaded: true, 
         noData: true 
        }); 
       } 

      }else if(responseData.type == 'error'){ 
       Alert.alert('Error', responseData.msg); 
      }else{ 
       Alert.alert('Error', 'Oops! Something went wrong. Sorry for the inconvenience caused. Please try again.'); 
      } 
     }) 
     .catch((error) => { Alert.alert('_valid_token error', error); }); 
    }, 

    loadingView: function(){ 
     return(<View style={styles.container}> 
      <Text>Loading Projects...</Text> 
     </View>); 
    }, 

    noRecords: function(){ 
     return(<View style={styles.container}> 
      <Text>No Projects to show</Text> 
     </View>); 
    }, 

    render: function() {  
    if(!this.state.loaded){ 
     return this.loadingView(); 
    }else{ 
     if(this.state.noData){ 
      return this.noRecords(); 
     }else{ 
      <ListView dataSource={this.state.dataSource} renderRow={this.renderRow} style={styles.listView} /> 
     } 
    } 

    }, 

    renderRow: function(row){ 
     return(<Row title={row.actions_name} subtitle={row.action_plan} tagline={row.company_name}/>); 
    }, 
}); 

var styles = StyleSheet.create({ 
    container: {  
     flex: 1, 
     backgroundColor: 'transparent', 
     justifyContent: 'center', 
     alignItems: 'center', 
    }, 
    listView: { 

    } 
}); 

module.exports = Projects; 

 
I am getting error right at 

    var ds = new ListView.DataSource({ rowHasChanged: (row1, row2) => row1 !== row2, }); 

react-native version I am using is 0.20.0 
and react-native-cli 0.1.10 

 
Error screenshot as below 
[![enter image description here][1]][1] 

Answer 1

My Bad.. 
I didn't use return function in render method 
Just changed
 

<ListView dataSource={this.state.dataSource} renderRow={this.renderRow} style={styles.listView} /> 
 

到
 

return(<ListView dataSource={this.state.dataSource} renderRow={this.renderRow} style={styles.listView} />);