Vue.js scope 問題

Question

嘿，所以我嘗試使用帶有條件 if 語句的 for 循環來刪除每個節點上可能存在或不存在的 class。

問題是由於某種原因，我不斷收到錯誤消息說 item[i] 未定義。 我無法弄清楚為什么我不在 scope 中並且在 If 語句中拋出 undefined 。 如果我在 for 循環之后控制台 Log item[i] 的第一行，item[i] 是完美的。

任何和所有的幫助表示贊賞！

    activeButton() {
      const item = event.target.parentNode.childNodes;
      for (let i = 0; i <= item.length; i++) {
        if (item[i].classList.contains('active')) {
          item[i].classList.remove('active');
        }
      }
      event.target.classList.toggle('active');
    }

Answer 1

我認為您應該將事件傳遞給 function 否則它將不知道什么是event （如果沒有作為參數傳入， event在哪里定義？）

activeButton(event) { // added event here
    const item = event.target.parentNode.childNodes;
    for (let i = 0; i <= item.length; i++) {
        if (item[i].classList.contains('active')) {
            item[i].classList.remove('active');
        }
    }

    event.target.classList.toggle('active');
}

Answer 2

沒有上下文，但我猜你的循環迭代了額外的時間。 item[length]將返回undefined

activeButton() {
  const item = event.target.parentNode.childNodes;
  for (let i = 0; i < item.length; i++) {
    if (item[i].classList.contains('active')) {
      item[i].classList.remove('active');
    }
  }
  event.target.classList.toggle('active');
}