Question

我想将Fetch API JSON存储为JavaScript对象，因此可以在其他地方使用它。 console.log测试有效，但是我无法访问数据。

以下作品：它显示带有三个待办事项的控制台条目：

 fetch('http://localhost:3000/api/todos')
    .then(data => data.json())
    .then(success => console.log(success));

以下内容无效：

fetch('http://localhost:3000/api/todos')
.then(data => data.json())
.then(success => JSON.parse(success));

如果我尝试访问成功，则其中不包含任何数据。

尝试过console.log，它可以正常工作。

还尝试了以下有效的方法：

fetch('http://localhost:3000/api/todos')
    .then(res => res.json())
    .then(data => {
        let output = '';
        data.forEach(function (todo) {
        output += `
            <ul>
                <li>ID: ${todo.id}</li>
                <li>Title: ${todo.title}</li>
                <li>IsDone: ${todo.isdone}</li>
            </ul>
            `;
        });
        document.getElementById('ToDoList').innerHTML = output;
        return output;
    })
    .catch(err => console.log('Something went wrong: ', err));

但是，我无法手动更新内部HTML；我需要该对象来执行其他UX。

Answer 1

您还可以使用如下功能：

 function doSomething(success){
   //do whatever you like
 }

 fetch('http://localhost:3000/api/todos')
    .then(data => data.json())
    .then(success => doSomething(success));

Answer 2

您可以使用如下所示的异步等待

df[df.duplicated(['col2','col3','col4'],keep=False)&~df.duplicated(['col1','col2','col3','col4'],keep=False)]
Out[70]: 
  col1  col2  col3 col4
0    a     1     2  abc
1    b     1     2  abc

Answer 3

您可以在外部声明一个变量，然后将结果分配给它

var yourTodos;

fetch('http://localhost:3000/api/todos')
    .then(data => data.json())
    .then(success => yourTodos = success);

然后，您将yourTodos作为您的javascript对象，可以随意使用它。

如何在JavaScript对象中存储Fetch API JSON响应

3 个答案: