在React Native中将阵列打印到屏幕

时间:2016-07-25 16:58:26

标签: ios arrays react-native

我只是想在我的React Native iOS应用程序中在屏幕上打印几个数组。现在没有任何东西出现在屏幕上。 for循环后的console.logs显示数组具有它们应该具有的数据,但它不会反映在屏幕上。如何在加载提取调用后再次渲染?这是我的代码:

'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 个答案:

答案 0 :(得分: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});