JS - fetch API,GET方法返回“ƒjson(){[native code]}”

时间:2018-02-13 19:49:15

标签: javascript fetch-api

我想了解两种获取方法之间的区别,一种是工作,另一种不是真的,但我不明白为什么。

这不起作用:

fetch('https://glo3102lab4.herokuapp.com/fee958c0-c320-40d0-a750-218f2d7c1303/tasks', {
    method: 'GET',
}).then(res => res.json)
    .catch(error => {
        console.error('Error:', error);
    })
    .then(response => {
        console.log(response);
    });

并返回:

  

ƒjson(){[native code]}

效果很好:

fetch('https://glo3102lab4.herokuapp.com/fee958c0-c320-40d0-a750-218f2d7c1303/tasks').then(function(response){
    response.json().then(function(data) {
        console.log(data);
    });
}).catch(function(error) {
    console.log('Fetch Error:', error);
});

并返回:

  

{tasks:Array(4)} tasks:(4)[{...},{...},{...},{...}]    proto :对象

如果您想尝试一下:

fetch('https://glo3102lab4.herokuapp.com/fee958c0-c320-40d0-a750-218f2d7c1303/tasks', {
        method: 'GET',
    }).then(res => res.json)
        .catch(error => {
            console.error('Error:', error);
        })
        .then(response => {
            console.log("first way");
            console.log(response);
        });
        
fetch('https://glo3102lab4.herokuapp.com/fee958c0-c320-40d0-a750-218f2d7c1303/tasks').then(function(response){
        response.json().then(function(data) {
            console.log("second way");
            console.log(data);
        });
    }).catch(function(error) {
        console.log('Fetch Error:', error);
    });

2 个答案:

答案 0 :(得分:4)

它不起作用,因为您正在返回task = models.ForeignKey(Task, on_delete=models.SET_NULL, null=True) 函数。你必须打电话给它并返回一个承诺:

res.json

答案 1 :(得分:3)

.json是一个功能。你必须打电话给它。 .then(res => res.json())