Странная проблема мутации данных, как решить (обновлено с примером)?

Question

[ilovemaryjane]

Какая-то непонятная мутация происходит - https://codesandbox.io/s/n0o76nmz4

Проблема локализована на строке 60-62 в файле HelloWorld.vue
При скролле вниз должно быть обновление this.translateY на значение ticker
Все работает корректно если я вывожу в консоль this.translateY - ticker.
Но если я сделаю this.translateY = this.translateY - ticker то происходит многократное увеличение значения, при каждом скролле, значение прибавляет само себя, а должно только изменение скрола - тикер.

Что это такое?

Comments

[Михаил]

Привидите пример кода где 100% воспроизводится проблема. Так как в вашем примере всё ок.

[ilovemaryjane]

Проблема актуальна. Просто в этом примере все ок, у меня в коде не работает.

Answer 1

[xmoonlight]

Скорее всего, рекурсионный вызов из-за this и переменная меняет значение как снежный ком. Попробуйте использовать явное приращение, используя модуль от разницы текущего и предыдущего значения события.

Comments

[ilovemaryjane]

Боже мой, ну единици это пример просто.

[xmoonlight]

ilovemaryjane, у меня выводит корректно и приведённым кодом, и моим.
1001
1002
и т.д.
Запустил в хроме.

[xmoonlight]

ilovemaryjane, нельзя удалить вроде. выбери решением мой ответ, и никто не будет отвечать.

[ilovemaryjane]

Проблема актуальна. В моем коде не работает. Просто пример неудачный. Я не знаю в чем проблема.

[xmoonlight]

ilovemaryjane, давай весь код - как иначе то?)

[ilovemaryjane]

xmoonlight, Какая-то непонятная мутация происходит - https://codesandbox.io/s/jv1vyp8n55

Проблема локализована на строке 60-62 в файле HelloWorld.vue
При скролле вниз должно быть обновление this.translateY на значение ticker
Все работает корректно если я просто вывожу в консоль this.translateY - ticker.
Но если я сделаю this.translateY = this.translateY - ticker то происходит многократное увеличение значения, при каждом скролле, значение прибавляет само себя, а должно только изменение скрола - тикер.

Что это такое?

[xmoonlight]

ilovemaryjane, судя по всему, там проблема с this. Т.е. всегда берётся полученное значение и считается от него рекурсивно. А должно браться именно приращение. Т.е. надо сохранять в доп.переменной последнее значение и брать разницу текущего и из переменной по-модулю. И на его основе - производить расчёт.
Т.е. с this нужно разбираться.

[ilovemaryjane]

xmoonlight, так вся суть что мне надо сохранить это значение и передать его дальше. без this я не могу этого сделать

[xmoonlight]

ilovemaryjane, ну рекурсию не убрать просто так.

[ilovemaryjane]

xmoonlight, а по модулю это как? Я кажется понял в чем проблема. Он каждый раз прибавляет полное изменение значения!

Т.е. на первый скролл было общее изменение 5пк, он отнял 5. Ок.
На второй скролл было общее изменение на 10 пк. Т.е. еще 5, но мой код считает ОБЩЕЕ изменение. Поэтому отнимает 10, вместо еще одних 5. Как исправить я хз. Я запарился уже вводить дополнительные значения, в них легко утонут Как решать такое?

[xmoonlight]

ilovemaryjane, приращение=abs(предыдущий - текущий)

[ilovemaryjane]

xmoonlight, спасибо за совет. Благоаря совету юзать модуль я сделал хедер своей мечты)))

Только теперь собственный хедер болит ппц!!!

[xmoonlight]

ilovemaryjane, Поздравляю!!!