reactJS - 使用 Axios GET 请求的 useEffect() 空响应

Question

这是我尝试使用 Axios 请求从后端获取数据的地方： const [models, setModels] = useState([]);const sponsor_id = localStorage.getItem('sponsor_id');   useEffect(() => {        api.get('models', { sponsor_id }).then(response => {            setModels(response.data);        });    }, []);这是我的后端，它应该从数据库返回数据：module.exports = {    async index(request, response) {        const { sponsor_id } = request.body;        const models = await connection('model').select('*').where('sponsor_id', sponsor_id);        return response.json(models);    },但是前端的响应是空的。它应该返回一些数据。我希望有人能帮助我。

Answer 1

请检查这个例子。这里我在 useEffect 中调用 axios 并在 ui 中显示响应数据。

import React, {useEffect, useState} from "react";

import axios from 'axios';

function PostListPage() {

    const [posts, setPost] = useState([]);

    let signal = axios.CancelToken.source();

    useEffect(() => {

        let isSubscribed = true;

        axios.get(`https://jsonplaceholder.typicode.com/posts`, {

            cancelToken: signal.token,

        })

            .then(res => {

                const posts = res.data;

                setPost(posts);

            }).catch(err => {

            console.log(err);

        });

        return function cleanup() {

            isSubscribed = false;

            signal.cancel('Api is being canceled');

        }

    }, []);

    return (

        <React.Fragment>

            <ul>

                {

                    posts.map(post => <li key={post.id}>{post.title}</li>)

                }

            </ul>

        </React.Fragment>

    );

}

export default PostListPage;