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

问题描述

我使用的是 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 函数的日志。

这个 FOR 循环在我的 script.js 中使用时工作正常,但在我导出然后导入到 script.js 时不起作用。

有没有什么方法可以使用 ParcelJS 导出循环?

解决方法

移动

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

在您的 function collectData() { 中。

在捆绑 DOM 时不可用,呈现您的 rowCount undefined

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

0 < undefined - 2

undefined - 2 结果为 NaN

0 < NaN

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

,

试试这个。

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