Блог

Главная - Вопросы по программированию - Axios получает данные, но, похоже, я неправильно отображаю их на интерфейсе

Axios получает данные, но, похоже, я неправильно отображаю их на интерфейсе

#node.js #reactjs #axios

#node.js #reactjs #axios

Вопрос:

Привет, я все протестировал, и это работает. Axios действительно извлекает нужные мне данные. В настоящее время я пытаюсь реализовать это в моем render (), но, похоже, ничего не появляется. Я не уверен, что не так, поскольку я также не получаю никаких ошибок. Ниже приведено то, что я должен отобразить данные спереди.

 const [links, setLinks] = useState([]);

useEffect(() => {
    if (!userData.user)
        history.push("/");



    const checkAdmin = async () => {    
        let currAdmin = userData.user.adminId; 

        const adminRes = await Axios.get('http://localhost:9000/Links/all?currAdmin='   currAdmin);  
        setLinks(adminRes.data);   
    };
    checkAdmin();
}, []);

return (
    <div className="dashboard">
        <Header />
        <br /><br />

        <h3>Admin Type:</h3>
        <ListGroup className="linkList">
            {links.map(e => (    
                <ListGroup.item key={e.adminId}>
                    {e.links}
                </ListGroup.item>
            ))}
        </ListGroup>

    </div>

);

Комментарии:

1. Вы уверены, что ваш adminRes.data массив?

2. Вы уверены, что adminRes.data возвращает то, что вы ожидаете?

3. @kunquan Я полагал, что инициализировал его как массив с помощью функции useState, я довольно новичок в этом, извините. Я видел, как люди делали что-то вроде, let adminRes = [] хотя я не совсем уверен, правильно ли это или даже применимо к моей проблеме

4. @lissettdm Тестирование HTTP-ссылки с помощью axios показывает мне, что я получаю нужные данные currAdmin , и весь axios.get вызов наверняка работает. Я предполагаю, что я поступаю неправильно с данными, которые отправляются обратно

5. Покажите нам ответ axios.get() . Я думаю, проблема в том, что либо вы не получаете свои данные обратно, либо ваша форма данных неверна.

Ответ №1:

Вы пробовали вывести checkAdmin из useEffect?

 const [links, setLinks] = useState([]);

const checkAdmin = async () => {    
   let currAdmin = userData.user.adminId; 

   const adminRes = await Axios.get('http://localhost:9000/Links/all?currAdmin='   currAdmin);  
        setLinks(adminRes.data);   
};

useEffect(() => {
    if (!userData.user)
        history.push("/");

    checkAdmin();
}, []);

return (
    <div className="dashboard">
        <Header />
        <br /><br />

        <h3>Admin Type:</h3>
        <ListGroup className="linkList">
            {links.map(e => (    
                <ListGroup.item key={e.adminId}>
                    {e.links}
                </ListGroup.item>
            ))}
        </ListGroup>

    </div>

);
Метки: , , ,