typescript 将Cheerio对象Map到“原生”对象数组中

t30tvxxf  于 2022-12-01  发布在  TypeScript
关注(0)|答案(1)|浏览(142)

我在通过cheerio加载的文档中有以下HTML(使用不同的数据重复了几次):

<li class="wprm-recipe-ingredient">
  <span class="wprm-recipe-ingredient-amount">1</span>
  <span class="wprm-recipe-ingredient-unit">pound</span>
  <span class="wprm-recipe-ingredient-name">extra lean ground beef</span>
</li>

下面是我编写的表达我意图的代码:

const $ingredients = $("li[class='wprm-recipe-ingredient']");

const ingredients = $ingredients.map((_idx, $e) => {
    const $elem = $($e);
    const amount = $elem.children('[class$="-amount"]').text();
    const unit = $elem.children('[class$="-unit"]').text();
    const name = $elem.children('[class$="-name"]').text();
    return { amount, unit, name };
}); // => [{amount, unit, name}, { ... }]

但这句话说明了我的愿望,而不是我实际得到的。
实际的类型是const ingredients: Cheerio,它不是一个匿名对象数组,其中包含我试图创建的形状。
如何将$ingredientsMap为以下形状?

[{ amount: '1', unit: 'pound', name: 'extra lean ground beef' }]

请注意,Cheerio的.get()返回string[]CheerioElement[],因此这不是我所希望的。

编辑

我应该在这方面做一点扩展。
我目前正在做的是预先创建一个数组,然后在$ingredients.forEach(...)闭包的末尾将push ing到该数组上。

kgsdhlau

kgsdhlau1#

我会将可迭代对象扩展到一个传统数组中,并在其上使用原生的.map

const cheerio = require("cheerio"); // 1.0.0-rc.12

const html = `
<li class="wprm-recipe-ingredient">
  <span class="wprm-recipe-ingredient-amount">1</span>
  <span class="wprm-recipe-ingredient-unit">pound</span>
  <span class="wprm-recipe-ingredient-name">extra lean ground beef</span>
</li>
`;

const $ = cheerio.load(html);
const result = [...$(".wprm-recipe-ingredient")].map(e => ({
  amount: $(e).find(".wprm-recipe-ingredient-amount").text(),
  unit: $(e).find(".wprm-recipe-ingredient-unit").text(),
  name: $(e).find(".wprm-recipe-ingredient-name").text(),
}));
console.log(result);

这给出:

[ { amount: '1', unit: 'pound', name: 'extra lean ground beef' } ]

相关问题