我创建了一个简单的函数来通过存储的令牌对用户进行身份验证,该函数基于一个promise,如果它已成功连接到我们的服务器API,则返回带有用户详细信息的响应,如果有服务器连接,它将返回通过React-native fetch方法拒绝指定的错误。
import React, { Component } from 'react';
import {
Text,
View,
AlertIOS,
} from 'react-native';
function AuthAPI(token)
{
return new Promise((resolve, reject) => {
fetch("https://myawesomeapi.com/auth", {
method: "POST",
body: '{"token": "' + token + '"}',
})
.then((response) => response.json())
.then((response) => {
resolve(response);
})
.catch((error) => {
reject(error);
});
});
}
export default class Home extends Component
{
constructor(props)
{
super(props);
this.state = {
bodyMessage: 'Waiting for response!',
};
}
componentWillMount()
{
AuthAPI("token-here")
.then((response) => {
const justAnotherVar = iamNotExist; // this will throw an error in next .catch
AlertIOS.alert("Your Name: " + response.userFullName);
this.setState({bodyMessage: 'Fetch is done with a response!'});
})
.catch((error) => {
console.err(error);
});
}
render()
{
const { bodyMessage } = this.state;
return (
<View style={{
flex: 1,
justifyContent: 'center',
alignItems: 'center',
}}>
<Text>Welcome..</Text>
<Text>{bodyMessage}</Text>
</View>
);
}
}
问题解释:
当AuthAPI.then(/***/)
内部出现错误时,它将被AuthAPI.catch
捕获,但据我所知AuthAPI.catch
只会捕获来自该承诺拒绝的react-native fetch方法错误返回的错误。
例如,在AuthAPI.then
内,我已经为一个新的常量变量const justAnotherVar = iamNotExist;
分配了一个未定义的变量,这样就会在下一个catch中抛出一个错误。
ReferenceError: Can't find variable: iamNotExist
我想要的是让AuthAPI.catch
仅获取获取方法错误,并在AuthAPI.then(/***/)
答案 0 :(得分:0)
我认为这是打算发生的,请在此处阅读更多内容:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/catch
你可以做的是添加一个try / catch,以便.then语句有自己的错误处理,并且在出现问题时不会触发.catch:
AuthAPI("token-here")
.then((response) => {
try {
const justAnotherVar = iamNotExist; // this will throw an error in next .catch
AlertIOS.alert("Your Name: " + response.userFullName);
this.setState({bodyMessage: 'Fetch is done with a response!'});
} catch (e) {
//error handling
}
})
.catch((error) => {
console.err(error);
});