React Axios Call Возврат всей функции
У меня есть вызов Axios ниже
getDetail = () => {
this.apiGetDetail
.callApi(description)
.then(data => {
return(data.data);
})
.catch(error => {
console.info("Failed");
});
};
Когда я получаю возвращаемое значение из функции getDetail, оно каждый раз оказывается неопределенным. Я попытался создать переменную make value, равную данным, и вернуть ее, но это тоже не сработало. Всегда кажется, что getDetail завершается до вызова apiGetDetail API и ничего не возвращает. Я попытался отправить данные, которые были возвращены в хранилище Redux или в локальное состояние, но это не сработало для настроенной таблицы React.
У меня есть ниже subComponent для таблицы React
SubComponent = {row => {
let myDetail = this.getDetail(
row.original.cusip,
row.original.description,
detailColumns
);
return (
<ReactTable
data = {Array.from(myDetail)}
columns = {detailColumns}
style = {{ height: "400px" }}
minRows = "5"
noDataText = "No Data"
/>
);
}}
но его нельзя отобразить, потому что данные возвращаются пустыми.
Как я могу убедиться, что функция getDetail ожидает возврата вызова apiGetDetail, а затем возвращает значение данных, полученное из этого ??
Обновлено: я уверен, что это можно сделать с помощью асинхронного ожидания, но я не знаю, как я могу применить это к этой настройке. Я никогда раньше не выполнял асинхронное ожидание...
Информация о дубликате является одним из лучших знаний об асинхронном поведении, которые вы найдете в Интернете, не спешите дискредитировать его, потому что вы думаете, что он слишком длинный.
@SterlingArcher вместо того, чтобы помечать его как дубликат, вы можете сделать то, что сделал Маурисио Карлеццо, попытаться помочь конкретно в этом случае и получить репутацию, чтобы помочь кому-то. Как мне это сделать? Вариант 1: прочитайте эту длинную страницу, Вариант 2: сделайте то-то и то-то. какой вариант полезен?
Ответы 1
сначала я думаю, что ваша функция getDetail возвращает undefined, вы должны поставить,
**return** this.apiGetDetail
Но в этом случае это вернет обещание, я думаю, что это не лучший подход, поэтому здесь let myDetail = this.getDetail( вам нужно будет дождаться возврата обещания, и я думаю, что внутри метода рендеринга это нехорошо! Вы можете прочитать больше об асинхронности и ждать!
Но я думаю, что лучше, если вы вместо setState вернете значение напрямую, например, там, где у вас есть return(data.data);, вы должны использовать this.setState({ myDetail });.
И затем в методе рендеринга вы можете получить доступ к значению, например this.state.myDetail
@SterlingArcher Такой простой ответ, ха!? отметьте это как дубликат вопроса, на который есть 10-страничный ответ. Я знаю, что это можно сделать с помощью async-await. Я не знаю, как это реализовать. Если вы это сделаете, дайте ответ, чтобы легко пометить материал дубликатом!