Question

我在使用promise回调从json分发信息时遇到问题。我已经显示了帖子，但是我无法显示每个帖子的评论。是的。

这是我的代码

JS

var root = 'https://jsonplaceholder.typicode.com/posts'

$.ajax({
    url: root,
    method:'GET',
    data:{
        a:''
    }
})

  .done(function(post) {

      for(i=0 ; i<10;i++){
        document.write(JSON.stringify(post[i]))
        document.write('<br>')
        document.write('<br>')
        document.write('<br>')
      }

  })
 .done(function(comments){
    for(j=0; j<10;j++){
        $.ajax({
          url: root +'/'+ j+'/comments',
          method:'GET',
          comments:{
              b:''
          }

      })
            }

 })

Answer 1

如果您可以将ES8语法与async await一起使用，请按照以下步骤操作：

async function getHTML() {
    const root = 'https://jsonplaceholder.typicode.com/posts';
    const response = await $.get(root);
    let html = "";
    for (let i = 0; i < 10; i++) {
        html += JSON.stringify(response[i]) + "</br>";
        comments = await $.get(root +'/' + i +'/comments');
        for (const comment of comments) {
            html += JSON.stringify(comment) + "</br>";
        }
    }
    return html;
}

getHTML().then(html => console.log(html), err => console.error(err));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

这是使用ES6 Promise.all的方法：

function getHTML() {
    var root = 'https://jsonplaceholder.typicode.com/posts';
    return $.get(root).then(function (response) {
        var html = "";
        var promises = []; // collect the requests for all comments
        for (var i = 0; i < 10; i++) {
            promises.push($.get(root +'/' + i +'/comments').promise());
        }
        return Promise.all(promises).then(function (response2) {
            for (var i = 0; i < 10; i++) {
                html += JSON.stringify(response[i]) + "</br>";
                for (var j = 0; j < response2.length; j++) {
                    html += JSON.stringify(response2[j]) + "</br>";
                }
            }
            return html;
        });
    });
}

getHTML().then((html) => console.log(html));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 2

由于某种原因，您在两个不同的线程中问过两次问题。我已经here回答了。

回调函数承诺ajax

2 个答案: