React native 如何在React Native中从API获取数据？

我需要一些帮助，以便使用GET请求从API获取数据。我只能在控制台上显示数据，但我不知道如何在设备上显示数据。有人能帮我吗

这是我的密码：

class HomeScreen extends React.Component {
constructor(props) {
    super(props);
    this.state = {
     currentDate: new Date(),
     markedDate: moment(new Date()).format("YYYY-MM-DD"),
     isLoading: true,
     data: ''
    };
}


componentDidMount() {
     fetch("https://URL/api/schedule?filters[employee_id]=6", {method: "GET"})
    .then((response) => response.json())
    .then((responseJson) => {
       this.setState({...this.state, isLoading:false, data:responseJSON}); //set the state with data 
    })
    .catch((error) => {
         console.error(error);
    });
}

render() {
    const today = this.state.currentDate;
    const month = moment(today).format("MMMM");
    const date = moment(today).format("D")
    const day = moment(today).format("dddd");

    const data = this.state;

    return (... 

<FlatList 
                data={this.state.data}
                renderItem={({item,index})=>
                         (
                         <Text>{item.id}</Text>
                    )
                 }
                }
                 keyExtractor={(item)=>item.id.toString()}
            />

---

您应该保存进入状态的数据，然后使用map（）或Flatlist组件对其进行循环

  this.state = {
        ....
        data: []
    };

componentDidMount() {
         fetch("https://URL/api/schedule?filters[employee_id]=6", {method: "GET"})
        .then((response) => response.json())
        .then((responseJson) => {
           this.setState({data: responseJson});
           console.log(responseJson);
        })
        .catch((error) => {
            console.error(error);
        });
    }


Ui

<FlatList 
    data={this.state.data}
    renderItem={({item,index})=>
             (
             <Text>{item.id}</Text>
        )
     }
     keyExtractor={(item)=>item.id.toString()}
/>

this.state={
....
数据：[]
};
componentDidMount（）{
取回（“https://URL/api/schedule?filters[employee_id]=6“，{method:“GET”}）
.then（（response）=>response.json（））
.然后（（responseJson）=>{
this.setState（{data:responseJson}）；
console.log（responseJson）；
})
.catch（（错误）=>{
控制台错误（error）；
});
}
用户界面
(
{item.id}
)
}
keyExtractor={（item）=>item.id.toString（）}
/>

我认为大致如下：

 constructor(props) {
        super(props);
        this.state = {
         currentDate: new Date(),
         markedDate: moment(new Date()).format("YYYY-MM-DD"),
         isLoading: true,
         data: [] //should be an array
        };
    }


    componentDidMount() {
         fetch("https://URL/api/schedule?filters[employee_id]=6", {method: "GET"})
        .then((response) => response.json())
        .then((responseJson) => {
           this.setState({...this.state, isLoading:false, data:responseJSON}); //set the state with data 
        })
        .catch((error) => {
             console.error(error);
        });
    }

    render() {
        const today = this.state.currentDate;
        const month = moment(today).format("MMMM");
        const date = moment(today).format("D")
        const day = moment(today).format("dddd");

        const data = this.state.data; //amd you are good from here
   }

---

你只需要设置状态，就可以了。为了让您的生活更轻松，如果我没有提到MOBX和Redux可能会让您的生活更轻松

它说：对象作为React子对象无效（找到：带有键{data，meta}的对象），如果您要呈现子对象集合，请改为使用数组。它说：元素类型无效：需要字符串（对于内置组件）或类/函数（用于复合组件），但得到：未定义。您可能忘记导出组件了…从“react native”添加

import{FlatList}

我刚刚有一个拼写错误，请再试一次！嗯，尝试将数据状态从字符串“”更改为数组[]，如果不起作用，我们将首先解决问题，对didMount进行注释或不更新状态，然后在平面列表中传递此

data={[1,2,3]}

并在render item return

{index}

中，让我知道u gotnefined不是对象（计算'item.id.toString'））

 constructor(props) {
        super(props);
        this.state = {
         currentDate: new Date(),
         markedDate: moment(new Date()).format("YYYY-MM-DD"),
         isLoading: true,
         data: [] //should be an array
        };
    }


    componentDidMount() {
         fetch("https://URL/api/schedule?filters[employee_id]=6", {method: "GET"})
        .then((response) => response.json())
        .then((responseJson) => {
           this.setState({...this.state, isLoading:false, data:responseJSON}); //set the state with data 
        })
        .catch((error) => {
             console.error(error);
        });
    }

    render() {
        const today = this.state.currentDate;
        const month = moment(today).format("MMMM");
        const date = moment(today).format("D")
        const day = moment(today).format("dddd");

        const data = this.state.data; //amd you are good from here
   }