从Promise设置对象数组[复制]

问题描述 投票:0回答:1

这个问题在这里已有答案:

function getSuggestions(inputValue) {
  let results = [];
  axios.get(`${API_URL}?queryString=${inputValue}`)
    .then(({ data }) => {
      results = data;
    })
  let textValues = results.map(r => (textValues.push(r.text.toUpperCase())));
  //push all unique values to Set
  let uniqSet = new Set(textValues);
  //turn Set into Array object
  let uniqArr = Array.from(uniqSet)
  let suggestions = uniqArr.map(r => (suggestions.push({'label': r.text.toUpperCase()})));
  return suggestions.filter(suggestion => {
    const keep =
      (!inputValue || suggestion.label.toLowerCase().includes(inputValue.toLowerCase())) &&
      count < 5;

    if (keep) {
      count += 1;
    }

    return keep;
  });
}

我有这个函数来创建一个自动完成的搜索组件,我在其中输入用户输入的inputValue并将其发送到端点,然后端点返回搜索项的对象。

我试图将这个空的results数组设置为我用axios提取的data对象。无论我尝试什么,结果数组总是保持空白。有什么建议?先感谢您。

javascript arrays reactjs
1个回答
1
投票

axios代码是异步的,代码的其余部分不是(并且不等待异步代码)。如果您不需要支持旧浏览器,最好的办法是使用async/await

async function getSuggestions(inputValue) {
  let results = await axios.get(`${API_URL}?queryString=${inputValue}`).then(({ data }) => data)
  let textValues = results.map(r => (textValues.push(r.text.toUpperCase())));
  //push all unique values to Set
  let uniqSet = new Set(textValues);
  //turn Set into Array object
  let uniqArr = Array.from(uniqSet)
  let suggestions = uniqArr.map(r => (suggestions.push({'label': r.text.toUpperCase()})));
  return suggestions.filter(suggestion => {
    const keep =
      (!inputValue || suggestion.label.toLowerCase().includes(inputValue.toLowerCase())) &&
      count < 5;

    if (keep) {
      count += 1;
    }

    return keep;
  });
}

否则,您的函数可能需要返回一个promise,因为结果是异步的:

function getSuggestions(inputValue) {
  return axios.get(`${API_URL}?queryString=${inputValue}`).then(({ data }) => {
    let textValues = data.map(r => (textValues.push(r.text.toUpperCase())));
    //push all unique values to Set
    let uniqSet = new Set(textValues);
    //turn Set into Array object
    let uniqArr = Array.from(uniqSet)
    let suggestions = uniqArr.map(r => (suggestions.push({'label': r.text.toUpperCase()})));
    return suggestions.filter(suggestion => {
      const keep =
        (!inputValue || suggestion.label.toLowerCase().includes(inputValue.toLowerCase())) &&
        count < 5;

      if (keep) {
        count += 1;
      }

      return keep;
    });
  })  
}

getSuggestions('test').then(keep => {
  // do something with response
})
© www.soinside.com 2019 - 2024. All rights reserved.