Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Input @keydown class binding - Micro/Macro Task #7153

EthanDM opened this issue Nov 29, 2017 · 0 comments


Copy link

@EthanDM EthanDM commented Nov 29, 2017



Reproduction link

Steps to reproduce

Enter a number into the input field. @keydown then fires the keyDwn(e) method, setting this.untouched = false. The green background should be removed on the input field since it has been "touched."

What is expected?

The pressed number should be entered into the input field. Instead, no number is added and it is only after the second press that it is.

If the class binding is removed from the input field it has no problem acting as expected, so I don't think it's an issue with @keydown or setting "this.untouched = false". In addition, if the class binding is left on and v-model.lazy is set to v-model, it works as expected. However, v-model will not work for my use case.

What is actually happening?

The class binding is set but no number is added to the field as it did in Vue 2.2.6 -> 2.4.4.

See here for a reproduction in 2.4.4 and all works as expected with the class binding and v-model.lazy:

EDIT: I assume it's related to this release note from v2.5.0:

We have changed the implementation of Vue.nextTick to fix a few bugs (related to #6566, #6690). The change involves using a macro task instead of a micro task to defer DOM updates when inside a DOM event handler attached via v-on. This means any Vue updates triggered by state changes inside v-on handlers will be now deferred using a macro task. This may lead to changes in behavior when dealing with native DOM events.

For more details regarding micro/macro tasks, see this blog post.

For the new implementation, see source code for nextTick.

Now I'm not sure if it's a bug or expected behavior due to the change but will need a solution. Thanks.

@EthanDM EthanDM changed the title Input @keydown class binding Input @keydown class binding - Micro/Macro Task Nov 30, 2017
@yyx990803 yyx990803 closed this in 60da366 Nov 30, 2017
lovelope added a commit to lovelope/vue that referenced this issue Feb 1, 2018
f2009 pushed a commit to f2009/vue that referenced this issue Jan 25, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
1 participant
You can’t perform that action at this time.