Запросы для формы, которая отправляется через ajax, умножаются с каждой последующей отправкой

Question

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

Теперь я уверен, что это из-за способа, которым я настроил submit-intercept, но я не знаю, как еще это сделать, хотя все еще инкапсулирую его как один компонент.

Я использую реагирование в качестве своего слоя представления, и я прикрепил функцию, которая содержит код для перехвата запроса, и эта функция вызывается как в afterMount обратный вызов и after_update Перезвоните; если я не делаю этого, то либо отправка формы никогда не перехватывается, либо перехватывает ее только один раз, а затем просто выполняет обычную отправку.

Теперь очевидно, что это умножение, потому что эти события запускаются и добавляют дополнительный обработчик submit.

Я использую opal и response.rb, поэтому код может выглядеть немного странно.

Вот моя функция, которая перехватывает действие отправки в форме

def set_up_login_form
    puts 'setting up form'
    login_form = Element["#login_form"]
    login_form.on :submit do |event|
        unless login_state == :processing
            event.prevent_default
            username = login_form.find('#username').value
            password = login_form.find('#password').value
            login!
            self.username = username
            self.handle_login_submit({username: username , password: password})
        end 
    end
end

Вот мои обратные звонки:

after_mount do
    fix_button #untill materialize.js gets fixed
    set_up_login_form
end

after_update do
    set_up_login_form
end

Я смог уменьшить количество запросов, сделав проверку, было ли состояние компонента уже в середине запроса, хотя это не уменьшает количество добавляемых обработчиков отправки, но мешает хорошему количеству делать что-либо, но это не останавливает фактическое умножение добавляемых обработчиков.

Answer 1

Я не знаю, почему я не думал об этом, пока коллега не упомянул об этом, но, переместив форму в подкомпонент, я теперь могу запустить код перехвата при монтировании компонентов формы, который происходит только тогда, когда он отображается, так что проблема решена!