似乎我的Promise同时返回了true和false。控制台返回“ undefined”,然后在其正下方返回“出问题了”。数据将在这些下方返回,表明它实际上并没有在Promise上等待。
这里是被调用的函数:
module.exports = (url) => {
return new Promise((resolve, reject) => {
axios({
method: 'get',
url: url
})
.then(response => {
const html = response.data
const $ = cheerio.load(html)
const songtable = $('.chart-list__elements > li')
const topsongs = []
songtable.each(function () {
const rank = $(this).find('.chart-element__rank__number').text()
if (rank == 11) return false;
const name = $(this).find('.chart-element__information__song').text()
const artist = $(this).find('.chart-element__information__artist').text()
topsongs.push({
rank,
name,
artist
})
})
resolve()
return topsongs;
})
.catch(reject("something went wrong"))
})
}
来自呼叫者:
componentDidMount() {
const top_songs = topsongs('https://www.billboard.com/charts/hot-100')
.then(console.log(top_songs))
.catch(err => console.log(err))
}
谢谢,我是Promises的新手,并且尝试了几乎所有方法。尽管有axios()异步调用,但我还是有一个Promise的原因是,它不是异步执行的,并且返回未定义的数据。
答案 0 :(得分:3)
.catch(reject("something went wrong"))
您需要将功能传递给catch
。
您正在立即致电 reject
并传递其返回值。
您还使用了嵌套的Promise反模式。
axios
返回一个承诺。无需创建另一个。
module.exports = (url) =>
axios({
method: "get",
url: url,
})
.then((response) => {
const html = response.data;
const $ = cheerio.load(html);
const songtable = $(".chart-list__elements > li");
const topsongs = [];
songtable.each(function () {
const rank = $(this).find(".chart-element__rank__number").text();
if (rank == 11) return false;
const name = $(this).find(".chart-element__information__song").text();
const artist = $(this)
.find(".chart-element__information__artist")
.text();
topsongs.push({
rank,
name,
artist,
});
});
return topsongs;
})
.catch(() => {throw "something went wrong"});
(用一般的“出了点问题”代替引发的错误似乎没有帮助。完全没有该catch调用可能会更好)
答案 1 :(得分:0)
您已经有一个诺言,只需兑现即可。
return axios({
method: 'get',
url: url
})
.then(response => {
const html = response.data
const $ = cheerio.load(html)
const songtable = $('.chart-list__elements > li')
const topsongs = []
songtable.each(function () {
const rank = $(this).find('.chart-element__rank__number').text()
if (rank == 11) return false;
const name = $(this).find('.chart-element__information__song').text()
const artist = $(this).find('.chart-element__information__artist').text()
topsongs.push({
rank,
name,
artist
})
})
return topsongs;
})
async/await
仅用于“语法糖”,使所有内容都更易于阅读:
module.exports = async (url) => {
const { data } = await axios({method:'get',url});
const $ = cheerio.load(data);
...
return topsongs;
}