使用 ParcelJS 导出时循环不起作用答案

【问题标题】：Loop doesn't work when exported with ParcelJS使用 ParcelJS 导出时循环不起作用
【发布时间】：2021-06-22 13:18:39
【问题描述】：

我正在使用 ParcelJS V2。我有以下代码从 HTML 表中获取数据。单元格中的每个<td> 都包含一个<input> 标签，getElementById 指的是输入标签的ID。

getCount.js

let rowCount = document.getElementById("left-col__table").rows.length;

let dataExport = []
let tuple = []

let i

function collectData() {

    for (i = 0; i < rowCount - 2; i++) {
        
        console.log("RowCount: " + rowCount)
        
        tuple.push(document.getElementById("x-in-" + i.toString()).value)
        tuple.push(document.getElementById("y-in-" + i.toString()).value)

        console.log(tuple);

        dataExport.push(tuple)

        tuple = []
    }

    console.log("DataExport:" + dataExport.toString())
}

export default collectData

script.js

import collectData from '....'

collectData()

当我检查控制台时，collectData 函数没有日志。

当我在 script.js 中使用此 FOR 循环时，它可以正常工作，但在我导出然后导入到 script.js 时却无法正常工作。

有没有使用 ParcelJS 导出循环的方法？

【问题讨论】：

能否请您向我们展示您如何做到这一点的正确示例，因为这无济于事。
@kunalpanchal 很抱歉首先不清楚。我试着进一步澄清。谢谢
我不认为导出依赖于在导入时可用的 DOM 的 function 是一个好主意 (let rowCount = document.getElementById("left-col__table").rows.length;)。将变量声明移到函数内。
@connexo 嗨，感谢您的提示。将变量移入函数后，我的函数现在可以工作了。

标签： javascript html parceljs

【解决方案1】：

移动

let rowCount = document.getElementById("left-col__table").rows.length;

在您的function collectData() { 中。

在捆绑 DOM 时不可用，渲染您的 rowCount undefined。

当你的函数被执行时，你的循环结束条件检查

0 < undefined - 2

undefined - 2 产生NaN。

0 < NaN

是false，所以你的循环永远不会运行。

【讨论】：

【解决方案2】：

试试这个。

`getCount.js`

function collectData() {

  let rowCount = document.getElementById("left-col__table").rows.length;

  let dataExport = []
  let tuple = []

  let i

  for (i = 0; i < rowCount - 2; i++) {

    console.log("RowCount: " + rowCount)

    tuple.push(document.getElementById("x-in-" + i.toString()).value)
    tuple.push(document.getElementById("y-in-" + i.toString()).value)

    console.log(tuple);

    dataExport.push(tuple)

    tuple = []
  }

  console.log("DataExport:" + dataExport.toString())
}

export default collectData

【讨论】：