[英]Unhandled promise rejection error in react native?
我正在使用axios从API端点获取数据。 我收到错误 - >可能未处理的promise promise类型错误:undefined不是函数(评估res.json())
我正在使用react-redux和redux-thunk with react native app。
venueAction.js:
import { FETCH_VENUES } from './types';
import axios from 'axios';
export const fetchVenues = () => dispatch => {
axios.get(`my_api_link`)
.then( res => res.json())
.then( venues =>
dispatch({
type: FETCH_VENUES,
payload: venues
})
)
.catch( error => {
console.log(error);
});
};
检查下面的截图:
需要在响应上调用json()
是Fetch API的一部分。 Axios实现了XMLHttpRequest ,这意味着您不需要这样做。
axios.get(`my_api_link`)
.then(venues => {
...
});
Axios是一个Javascript库,用于从浏览器发出来自node.js或XMLHttpRequests的http请求,它支持JS ES6原生的Promise API。 它与.fetch()的另一个特性是它执行JSON数据的自动转换。
如果使用.fetch(),则在处理JSON数据时有两个步骤。 第一个是发出实际请求,然后第二个是在响应上调用.json()方法。
- 获取 Jason Arnold在Medium上发出http请求时的Fetch vs. Axios.js
好的,现在你知道不要写这样的axios代码:
export const fetchVenues = () => dispatch => {
axios.get(`my_api_link`)
.then( res => res.json())
.then( venues =>
dispatch({
type: FETCH_VENUES,
payload: venues
})
)
.catch( error => {
console.log(error);
});
};
怎么办? 尝试使用ES8 async / await语法,如下所示:
export const fetchVenues = () => async dispatch => {
try {
const url = 'http://api.funwithredux.com/';
let { data } = await axios.get(url);
dispatch({ type: FETCH_VENUES, payload: data });
console.log(data);
} catch (e) {
console.log(e);
}
};
正如您所看到的,如果您愿意,可以使用try / catch语句来捕获任何错误,我肯定会添加控制台日志以确保您从API端点获取数据。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.