#javascript #reactjs
Вопрос:
Мне было интересно, почему данные из вызова api с axios возвращаются только один раз, и каждый раз это пустой заранее определенный массив. Вот код:
let { id } = useParams();
var [activity, setActivity] = useState([]);
var [loading, setLoading] = useState(true);
useEffect(() => {
axios.get("http://localhost:8080/api/auth/admin", {
headers: {
'Content-Type': 'application/json',
'x-access-token': AuthHeader()['x-access-token']
}
}).then((response) => {
if (response.data.unauthorized) {
AuthService.logout();
}
});
axios.get(`http://localhost:8080/api/auth/get_activity/${id}`).then((response) => {
setActivity(response.data);
setLoading(false);
console.log(activity);
});
}, [id]);
Теперь, когда пользователь нажимает на ссылку на другой странице, history.push(/user-activity/${value._id}
он попадает на эту страницу, и идентификатор, который является useParams, используется для axios.получите возможность собирать данные и отображать их, но это происходит только тогда, когда я добавляю или удаляю идентификатор в состоянии useEffect и обновляю страницу.
Есть какие-нибудь идеи о том, как это решить?
Комментарии:
1. ваш вопрос действительно неясен, пожалуйста, отредактируйте его, объясните подробнее и расскажите нам об этих вещах (в чем проблема, каковы ожидания, каков результат).
2. Ну, я думал, что объяснил, но вот еще что: каждый раз, когда посещается страница, активность должна быть настроена как реакция. данные из метода axios получают, как вы можете видеть в вопросе. Но это всегда пустой массив, как он определен в начале. В ответе нет данных. Когда я использую вызов почтальона, он работает нормально, но в приложении это не так.
3. Вы регистрируете действие сразу после его установки, установка состояния является асинхронным действием и должна быть обработана должным образом
4. Не могли бы вы, пожалуйста, лучше объяснить свой ответ, я удалил консоль. войдите, и это все та же проблема, никаких данных от вызова api.
5. Кроме того, зависит ли от этого ваш вызов api
axios.get("http://localhost:8080/api/auth/admin")
?
Ответ №1:
Функция useEffect() запускается при каждом последующем повторном рендеринге или обновлении. Теперь мы можем пропустить его, если передадим второй параметр (который представляет собой массив, содержащий список переменных состояния, за которыми нужно следить). Вы уже прошли его, [id]
но теперь react будет повторно запускать побочный эффект только в том случае, если изменится один из элементов в этом массиве.
Обновляются/изменяются ли ваши переменные состояния? Потому что, если это не так, то оно не будет запущено, потому что оно считает его одинаковым и не уникальным.
Комментарии:
1. Ну, даже если я не добавлю идентификатор в эффект использования, это все равно одно и то же, он возвращает пустой ответ. И мне нужно, чтобы он запускался при каждом повторном рендеринге.
2. затем удалите второй параметр, не передавайте его, и он будет отображаться каждый раз заново. Но будьте уверены, если вам действительно это так нужно.
3. Как я уже упоминал, даже если он удален, при каждом повторном рендеринге он возвращает пустой массив.
4. Я имею в виду, вообще ничего не передавайте. Например, вы делаете это
[]
или вообще не передаете этот второй аргумент, вот что я имел в виду, вот такuseEffect(() => { console.log('Component mounted') })
5. Я просто добавляю [], и все. Когда я ничего не добавляю, он выполняется бесконечно, а затем возвращает данные — бесконечно.