2016-07-25 37 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});