javascript - 在文本组件中显示请求结果时发生错误。使用 fetch() 方法

Question

其实这并不是一个错误，只是组件中没有显示请求的结果。

首先我发出了请求，我想在 Text 组件中显示请求的响应，但渲染时出现空组件

import React, {Component} from 'react';
import {View, Button, Text} from 'react-native'

export default class App extends Component{

  constructor(){
    super();

    url = 'https://b7web.com.br/todo/25088';

this.state = {
  lista:''
}

carregaDados = () => {
  fetch(this.url)
    .then(
      (res)=> res.json()
    )
    .then(
      (res)=>this.setState({lista:res.todo})
    );
}
  }


  render(){
     return(
  <View>
    <Text>{this.state.lista}</Text>
  </View>
);
}
}

Answer 1

问题是您正在尝试渲染组件内的对象数组，并且还没有为 View 提供样式，从而使每个子项都渲染在一行内。

如果你想渲染一个元素，你必须通过.map()循环遍历数组或使用Flatlist。

一个例子是:

<View style={{flex:1}}>
   {this.state.lista!==''&&this.state.lista.map((item, index) => 
      <Text key={index}>{item.item}</Text>
   }
    </View>