Question

我有一个要加载的页面。以下page.$eval()代码有效：

const productName = await page.$eval('h1[role="main"]', el =>
    [].reduce.call(
      el.childNodes,
      (a, b) =>
        a +
        (b.nodeType === 3
          ? b.textContent
              .replace(/[\r\n]+/gm, "")
              .replace(/\s+/g, " ")
              .trim()
          : ""),
      ""
    )
  );

通过工作，我的意思是它返回了预期的产品名称。我在主函数中运行它。

我现在想将代码外包给原始上下文之外的自己的函数（以供重用）。

我这样在主函数内部调用函数：

  const productName = await page
    .$('h1[role="main"]')
    .then(el => getProductNameFromSelector(el))
    .catch(err => console.log("failure product name", err));

外包功能如下：

const getProductNameFromSelector = async el =>
  el
    .evaluate(
      el,
      [].reduce.call(
        el.childNodes,
        (a, b) =>
          a +
          (b.nodeType === 3
            ? b.textContent
                .replace(/[\r\n]+/gm, "")
                .replace(/\s+/g, " ")
                .trim()
            : ""),
        ""
      )
    )
    .then(result => result)
    .catch(err => console.log("error in function", err, el));

它遇到以下错误：

failure product name TypeError: Cannot read property 'evaluate' of null
    at reduce (<anonymous>)
    at getProductNameFromSelector (pathToFile.js:395:17)
    at page.$.then.el (pathToFile.js:119:21)
    at process._tickCallback (internal/process/next_tick.js:68:7)

我应该从ElementHandle收到page.$('h1[role="main"]')。它说undefined。

Answer 1

evaluate函数需要将el元素作为参数

const getProductNameFromSelector = async el =>
  el
    .evaluate(el =>  //HERE
      [].reduce.call(
        el.childNodes,
        (a, b) =>
          a +
          (b.nodeType === 3
            ? b.textContent
                .replace(/[\r\n]+/gm, "")
                .replace(/\s+/g, " ")
                .trim()
            : ""),
        ""
      )
    )
    .then(result => result)
    .catch(err => console.log("error in function", err, el));

您也可以等待选择器：

const productName = await page
    .waitForSelector('h1[role="main"]')
    .then(el => getProductNameFromSelector(el))
    .catch(err => console.log("failure product name", err));

page.evaluate和page。$具有后续功能的不同行为

1 个答案: