Использование nodejs / Electron для добавления новой строки, в результате чего будет добавлено несколько строк

Question

У моего кода странное поведение. Таким образом, у меня есть флажок, и когда когда-либо проверяется файл, он добавляет новую строку с новым текстом

    checkbox.addEventListener('change', function () {
      if (checkbox.checked) {

        console.log('Checked');

        var logStream = fs.createWriteStream('C:/Users/solars/Desktop/myFile.txt', { flags: 'a' });
        // use {flags: 'a'} to append and {flags: 'w'} to erase and write a new file
        logStream.end('\nthis is the end line');

      } 

Но что происходит здесь:

1. Первый раз это проверено, новая строка появится с «это конец строки»
2. Я бы перепроверил, и три новые строки появятся из » это конечная строка «» (все вместе из 4 строк «это конечная строка»)
3. Я бы тогда снял флажок, ничего не происходит, как ожидалось
4. Я бы перепроверил и пять новых строк может появиться из «это конец строки» (все вместе из 9 строк «это конец строки»)

Я считаю, что это где-то цикл, и когда он снимает флажок, он добавляет один к количество строк для добавления (если это имеет смысл)

Есть идеи, как это исправить?

Весь код:

  <div class="main">
    <h1> click me </h1>
    <label class="switch"><input type="checkbox" id="togBtn">
      <div class="slider round"></div>
    </label>

    <script>
      src = "./renderer.js";
      const replace = require('replace-in-file');
      //const { dialog } = require('electron').remote;
      var fs = require('fs');
      var array = fs.readFileSync('C:/Users/solars/Desktop/myFile.txt').toString().split("\n");
      var checkbox = document.querySelector('input[type="checkbox"]');
      var arrayCheck = array.includes("triangle=3")
      //checkbox.checked = (arrayCheck) ? true : checkbox.checked
      document.getElementById("togBtn").addEventListener("click", () => {


        checkbox.addEventListener('change', function () {
          if (checkbox.checked) {

            console.log('Checked');

            var logStream = fs.createWriteStream('C:/Users/solars/Desktop/myFile.txt', { flags: 'a' });
            // use {flags: 'a'} to append and {flags: 'w'} to erase and write a new file
            logStream.end('\nthis is the end line');

          } else {

            console.log('Not checked');
            //code that set tiangle to  equal 3

          }
        });


      });
    </script>
  </div>

Answer 1

Ваш текущий код говорит: «Каждый раз, когда нажимается togBtn, добавьте прослушиватель к checkbox, который будет выполняться при change с.»

Нажмите кнопку пять раз - добавьте пять change слушателей checkbox. Каждый слушатель будет работать, когда флажок изменяет состояние, и чем больше раз вы нажимаете togBtn, тем больше раз будет выполняться функция слушателя в будущем.

Чтобы исправить, вам нужно структурировать свой код в таким образом, вы можете никогда добавить более одного слушателя, если вам действительно не нужно (маловероятно). Это, безусловно, потребует перемещения change слушателя за пределы click слушателя.