在异步函数中返回提取的问题 | 第2部分

Question

我目前遇到了一个问题，我希望能够返回提取接收到的内容，例如：

{"data": [{"account_id": 134519399, "account_url": "Pseudo", "ad_type": 0, "ad_url": "", "animated": false, "bandwidth": 110238, "datetime": 1603190775, "deletehash": "Mg3FROsdfPF7N", "description": null, "edited": "0", "favorite": false, "has_sound": false, "height": 368, "id": "3HzN2Ye", "in_gallery": false, "in_most_viral": false, "is_ad": false, "link": "https://i.imgur.com/lbWS8uo.jpg", "name": "unnamed.jpg", "nsfw": null, "section": null, "size": 55119, "tags": [Array], "title": null, "type": "image/jpeg", "views": 2, "vote": null, "width": 512}], "status": 200, "success": true}

但我目前收到这个：

{"_U": 0, "_V": 0, "_W": null, "_X": null}

这是我的代码：

export default async function FetchImage(access_token) {

var myHeaders = new Headers();

myHeaders.append("Authorization", "Bearer " + access_token);

var formdata = new FormData();

var requestOptions = {

    method: 'GET',

    headers: myHeaders,

    redirect: 'follow'

};

try {

    const response = await fetch("https://api.imgur.com/3/account/me/images", requestOptions)

    // console.log(await response.text());

    return response.json

}

catch (err) {

    console.log('fetch failed', err);

}

}

Answer 1

好的，我找到了解决方案，我必须对setState收到的内容进行处理。async componentDidMount() {        try {            let res = await FetchImage(this.props.navigation.state.params.access_token);            this.setState({ test: res })        } catch (error) {            console.error(error);        }    }我把它放在componentDidMount()函数中，这样就setState不会循环。

Answer 2

response.json()也是Promise。所以你应该附加await在它前面。export default async function FetchImage(access_token) {var myHeaders = new Headers();myHeaders.append("Authorization", "Bearer " + access_token);myHeaders.append("Content-Type", "application/json");var formdata = new FormData();var requestOptions = {    method: 'GET',    headers: myHeaders,    redirect: 'follow'};try {    const response = await fetch("https://api.imgur.com/3/account/me/images", requestOptions)    // console.log(await response.text());    return await response.json()}catch (err) {    console.log('fetch failed', err);}}

Answer 3

我刚刚看到，我的解决方案之后产生了同样的问题 async _getData() {    try {        this.state.test = await FetchImage(this.props.navigation.state.params.access_token);        console.log(this.state.test.data[0]["link"])        return (this.state.test)    } catch (error) {        console.error(error);    }    // console.log(res)}我在这里称呼他：render() {        try {            console.log(this._getData())                    } catch (error) {            console.error(error);        }        console.log("ici = " + this.props.test)        return (            <>                <View>                    <Text>access_token:</Text>                </View>                <View style={styles.buttonFav}>                    <Button buttonStyle={{ backgroundColor: '#4D4D4D' }} title="FavNav" onPress={() => this.props.navigation.navigate('FavNav')}></Button>                </View>                <View style={styles.buttonFind}>                    <Button buttonStyle={{ backgroundColor: '#4D4D4D' }} title="FindNav" onPress={() => this.props.navigation.navigate('FindNav')}></Button>                </View>            </>        )    }}但是，当我尝试使用存储在我的“this.state.test”中的内容时，它是“未定义的”。console.log(this._getData()) 显示这个{"_U": 0, "_V": 0, "_W": null, "_X": null}我很绝望 ：'（