我怎样才能“while循环”一个Axios GET调用，直到满足条件？

Question

我有一个API可以为留言板线程返回一个回复列表（每次通话限制5个回复）。我正在尝试做的是在响应中寻找特定的答复uuid。如果未找到，请为接下来的5个回复创建另一个AXIOS GET调用。

我想继续此循环，直到调用UUID或AXIOS GET调用返回而没有结果。

实施例API请求：

http://localhost:8080/api/v2/replies?type=thread&key=e96c7431-a001-4cf2-9998-4e177cde0ec3 

实施例的API的回复：

"status": "success", 
"data": [ 
    { 
     "uuid": "0a6bc471-b12e-45fc-bc4b-323914b99cfa", 
     "body": "This is a test 16.", 
     "created_at": "2017-07-16T23:44:21+00:00" 
    }, 
    { 
     "uuid": "0a2d2061-0642-47eb-a0f2-ca6ce5e2ea03", 
     "body": "This is a test 15.", 
     "created_at": "2017-07-16T23:44:16+00:00" 
    }, 
    { 
     "uuid": "32eaa855-18b1-487c-b1e7-52965d59196b", 
     "body": "This is a test 14.", 
     "created_at": "2017-07-16T23:44:12+00:00" 
    }, 
    { 
     "uuid": "3476bc69-3078-4693-9681-08dcf46ca438", 
     "body": "This is a test 13.", 
     "created_at": "2017-07-16T23:43:26+00:00" 
    }, 
    { 
     "uuid": "a3175007-4be0-47d3-87d0-ecead1b65e3a", 
     "body": "This is a test 12.", 
     "created_at": "2017-07-16T23:43:21+00:00" 
    } 
], 
"meta": { 
    "limit": 5, 
    "offset": 0, 
    "next_offset": 5, 
    "previous_offset": null, 
    "next_page": "http://localhost:8080/api/v2/replies?_limit=5&_offset=5", 
    "previous_page": null 
} 

环路将呼吁meta > next_page URL的AXIOS GET直到或者UUID在结果被发现或meta > next_page是空（意味着没有更多的答复）。

Answer 1

什么你应该寻找是不是while loop，但它被称为Recursion：

而：

var counter = 10; 
while(counter > 0) { 
    console.log(counter--); 
} 

递归：

var countdown = function(value) { 
    if (value > 0) { 
     console.log(value); 
     return countdown(value - 1); 
    } else { 
     return value; 
    } 
}; 
countdown(10); 

这意味着功能保持根据外面的具体标准调用自己放。这样，您就可以创建一个处理响应函数并再次调用本身如果该值不适合你很好（semicode）：

function get() { 
    axios.get('url').then(function(response) { 
     if (response.does.not.fit.yours.needs) { 
      get(); 
     } else { 
      // all done, ready to go! 
     } 
    }); 
} 

get(); 

如果你想它的诺言链接，那么你应该花一些时间认定它自己出来，每次只是回复一次承诺;）

Answer 2

如果您正在使用支持异步/等待的某些东西进行预编译，这很简单。下面只是一个例子。在你的情况下，你会检查你的指导或空的答复。

new Vue({ 
    el:"#app", 
    methods:{ 
    async getStuff(){ 
     let count = 0; 
     while (count < 5){ 
     let data = await axios.get("https://httpbin.org/get") 
     console.log(data) 
     count++ 
     } 
    } 
    }, 
    mounted(){ 
    this.getStuff() 
    } 
}) 

或者，按你的回应我的评论，

new Vue({ 
    el:"#app", 
    async created(){ 
     let count = 0; 
     while (count < 5){ 
     let data = await axios.get("https://httpbin.org/get") 
     // check here for your guid/empty response 
     console.log(data) 
     count++ 
     } 
    } 
}) 

Working example（在最新的Chrome至少）。