ElementUI's @ keyup.down.native event conflict, how to disable the event that comes with element?

When I press the down arrow of the keyboard when the

input box gets focus, it will trigger the event defined by myself @ keyup.down.native= "keyUpDown", and it will also trigger the event that comes with elementUI. How can I disable the event of elementUI?

Apr.11,2021

I looked through the ElementUI source code about el-input-number . The @ keydown event is directly bound to the
source code

because Vue is handled in the bubbling phase of the event, not in the propagation phase, I don't think it is possible to handle it directly with the @ modifier.
can provide two solutions. One is to check that data, records the results of both the change event and the down event after down. If it is modified by down, change it back.

the second method is to customize instructions to block events during the propagation phase of events

clipboard.png


bind your events like this:

@keyup.down.native.capture.prevent ="keyUpDown"

stop event propagation in the capture phase, so that event processing in the bubbling phase will not be carried out.

Menu