Событие клика Cycle.js/xstream передавалось один раз, но дважды

На странице есть один элемент кнопки и следующий поток кликов:

let submitClick$ = sources.DOM.select(buttonSel)
  .events("click")
  .mapTo(true)
  .debug(console.log)

Как только я нажму на кнопку, true вошел, что правильно.

Однако, когда я отображаю поток, код внутри запускается дважды:

let submitDeal$ = submitClick$.map(() => {
  console.log("Clicked")
  // ...
})

Никакие другие обработчики событий не должны быть присоединены к кнопке, а сам элемент находится внутри div:

button(".btn--add", "Submit")

Обычный event.preventDefault() а также event.stopPropagation() не имеет значения, и проверка события показывает, что оно происходит из того же элемента button.btn--add,

Не совсем уверен, что происходит, любые идеи ценятся! Спасибо!

Версии:

"@cycle/dom": "^12.2.5"
"@cycle/http": "^11.0.1"
"@cycle/xstream-run": "^3.1.0"
"xstream": "^6.4.0"

Обновление 1: я трижды проверил, и JS-файлы не загружаются дважды. Я использую Webpack, который связывает один app.js файл, который загружается на страницу (приложение Elixir/Phoenix). Также при проверке кнопки в Event Listeners Вкладка в Chrome Developer Tools, кажется, что прикреплено только 1 обработанное событие.

Обновление 2: суть с кодом

Источник

2 ответа

Решение

Оказывается, это произошло из-за ошибки в xstream, которая была исправлена ​​в xstream@7.0.0,

Источник

Слишком мало информации дано для решения этой проблемы. Однако некоторые вещи приходят на ум:

Вы не должны использовать .debug(console.log) но .debug(x => console.log(x)) вместо. по факту .debug() достаточно, он будет использовать console.log внутри.

Затем кнопка внутри <form>? Это может повлиять на события. В общем, этот вопрос требует более подробной информации.

Источник
Другие вопросы по тегам