Отображение нескольких данных в реагировать родной

Question

Я довольно новый, чтобы реагировать на родную. В настоящее время я получаю данные из моего node.js и пытаюсь отобразить все данные, которые я получил, в моем представлении. В реакции. js, я сделал

document mnet .getElementById.append ().

Каков наилучший способ сделать это в реагировать нативно?

мой код выглядит примерно так

class GlobalRankings extends Component{
  constructor(){
    super();
    this.state = {
    }
    this.getGlobalRankings();
  }

  getGlobalRankings(){
    var request = new Request(checkEnvPort(process.env.NODE_ENV) + '/api/global_rankings', {
            method: 'GET',
            headers: new Headers({ 'Content-Type' : 'application/json', 'Accept': 'application/json' })
    });
    fetch(request).then((response) => {
        response.json().then((data) => {
          console.log(data);
            for (var i in data.value){
              console.log(data.value[i]); //where i grab my data
            }
        });
    }).catch(function(err){
        console.log(err);
    })
}

  render(){
    return(
      <View style={styles.container}>
// want my data to be here
      </View>
    )
  }
}

Спасибо за помощь

Answer 1

Вы можете сделать массив в состоянии в конструкторе, this.state = { arr: [] }

Затем вы назначаете массив данных, полученный из ответа.

fetch(request).then((response) => {
    response.json().then((data) => {
        this.setState({ arr: data.array });
    });
}).catch(function(err){
    console.log(err);
});

Затем в теле компонента,

<View style={styles.container}>
  {
   this.state.arr.map((value, index) => {
      return(
          <Text key={index}>{value.text}</Text>
      );
   })
} 
</View>