react-native 获取异步/等待响应过滤

Posted 2023-02-27

【中文标题】react-native 获取异步/等待响应过滤

【英文标题】：react-native fetch async/await response filtering

【发布时间】：2018-04-05 18:09:57

【问题描述】：

我有来自我的服务器的响应，例如buildings : [record1, record2, ...]，我只想从该响应中获取数组。我怎样才能从 Promise 中获取数组？我尝试了一些异步/等待的东西，但我不明白如何在这段代码中使用它：

setupImpagination() 
    ....
    fetch(pageOffset, pageSize, stats) 
        return fetch(`http://localhost:3000/api/building/all?skip=$pageOffset&limit=$pageSize`)
            .then(response => 
            console.log('response.json() => ',response.json());
            response.json()
            )
            .catch((error) => 
            console.error(error);
            );

    
    );

【参考方案1】：

async function fetchData (url,  type = 'json'  = ) 
  return await (await fetch(url))[type]();

// Example: 
(async () => 
  console.log(await fetchData('http://canskit.com',  type: 'text' ));
)();

作为 ES7 上的原生 js，不针对 react-native

【参考方案2】：

.那么方式

 fetch(pageOffset, pageSize, stats) 
        return fetch(`http://localhost:3000/api/building/all?skip=$pageOffset&limit=$pageSize`)
            .then(response => 
               console.log('response.json() => ',response.json());
               response.json()
            ).then(responseJson => 
               return responseJson.buildings
            ).catch((error) => 
               console.error(error);
            );

        
    );

异步/等待方式：

 async fetch(pageOffset, pageSize, stats) 
       try 
           const response = await fetch(`http://localhost:3000/api/building/all?skip=$pageOffset&limit=$pageSize`);
           const responseJson = await response.json();
           return responseJson.buildings;
        catch(error)
            console.error(error);
       

【讨论】：

太好了，感谢您的回复，异步/等待解决方案为我解决了问题。我必须在fetch 之前添加async 然后它才起作用