javascript - 如何使数组在Javascript中的不同函数下可访问？

Question

我使用 React Table 从 API 获取数据并将其填充到表中。我进行 API 调用并获取数据。获得数据后，我提取一个包含电子邮件 ID 的字段，然后创建一个数组(emailList)。现在我想在之后的 POST API 调用中使用 emailList 中的数据作为正文的一部分。因此，在下面的代码中，POST 调用下的recipients 参数应包含emailList 的数据。 emailList 在 render 方法中全局声明为空数组。在我当前的设置中，由于范围问题，我收到了未定义的错误。如何在 POST 调用下访问该值？我已经浏览了一些范围界定 StackOverflow 答案并尝试过，但没有得到结果。

    columns: [
    {
filterable: false,
Header: 'Action',
accessor: 'action',
Cell: (e) => (
  <button
      onClick={() => {
        axios.get(URL, {
          headers: {
            'content-type': 'application/json',
            'Name' : user.Name,
          },
          responseType: 'json',
        })
        .then((response) => {
          let responseData = response.data.data;
          function getEmailList(input, email) {
            var output = [];
            for (var i=0;i<input.length; ++i)
              output.push(input[i][email]);
            return output;
          }
          emailList = getEmailList(responseData, "email");

          function fetchEmail() {
            this.emailList = getEmailList(responseData, "email");
          }  

        });

        //console.log(new fetchEmail().emailList);
        //Unable to get the value of emailList here
        axios({
          method: 'post',
          url: URL2,
          headers: {
            'content-type': 'application/json',
            'Name' : user.Name,
          },
          data: {
            "topic": "product",
            "message": {
               "sender": "user1@xyz.com",
               //For illustration I have hardcoded the email arrays for recipients
               "recipients": ["support1@xyz.com", "support2@xyz.com"],
              "data": {
                        "text": "refresh"
              },
           "attachment": null,
           "type": "",
            },
          },
        })

Answer 1

我认为这是一个竞争问题(也就是说，您尝试在电子邮件到达浏览器之前发布)，因此您需要更改代码以使帖子等待获取。这可以通过 promise 轻松完成:

 {
   //a cache
   let promise;

   //a promising getter:
   function getEmails (){
     //if cached return
     if( promise ) return promise;
     //else await the request
     return promise = axios.get(URL,{/*options*/}).then( response => response.data.data.map(obj => obj.email));
   }
 }

现在我们可以做:

 getEmails().then( console.log);
 getEmails().then( console.log);

两个调用都会返回相同的 Promise，因此只有一个请求，但我们可以多次调用它。例如，我们可以在执行 POST 之前调用它:

 getEmails().then( emails => {
  axios({
   //...
   data:{
    message:{
      recipients: emails
    }
  }
 });
});