2016-07-25 64 views
0

我只是想在我的React Native iOS應用程序的屏幕上打印幾個數組。現在屏幕上沒有任何東西顯示出來。在for循環之後的console.logs顯示數組擁有應該擁有的數據,但它不會反映在屏幕上。如何在fetch調用加載後再次渲染?這裏是我的代碼:將數組打印到React Native中屏幕

'use unique' 
import React, { Component } from 'react'; 
import { 
    StyleSheet, 
    TouchableHighlight, 
    Text, 
    View, 
    ListView 
} from 'react-native'; 

import api from './apicall'; 

class APIRequest extends Component { 

    constructor() { 
    super(); 

    this.state = { 
     users: [], 
     id: [], 
     type: [] 
    } 
    } 

    componentWillMount() { 

     api.getData() 
     .then((res) => { 
      this.setState({ 
      users: res 
      }) 
      for (var i = 0; i < this.state.users.length; i++) { 
      this.state.id.push(this.state.users[i].id); 
      this.state.type.push(this.state.users[i].type); 
     }); 
    } 

    render() { 
    return(
     <View style={styles.container}> 
     <Text style={styles.buttonText}> 
      {this.state.id} 
     </Text> 
     </View> 
    ); 
    } 
} 

回答

1
this.state.id.push(this.state.users[i].id); 
this.state.type.push(this.state.users[i].type); 

這是錯誤的方式來設置新的狀態。您應該執行以下操作:

var idArray = []; 
var typeArray = []; 
for (var i = 0; i < this.state.users.length; i++) { 
    idArray.push(this.state.users[i].id); 
    typeArray.push(this.state.users[i].type); 
} 
this.setState({id: idArray});