Example of instance of Vue keyboard carriage return

If it is the original INPUT, use @ Keyup.Enter, if you use the Element-UI, add the native limit, because the Element-UI encapsulates the INPUT, and the original event does not work. The code is as follows:

      
Now found this keyboard event seems to INPUT The box supports better, and how much other elements will have a bit problem, or it is directly invalid, and the reason is that other elements do not get focus or no keyboard events.
I have now a solution,

If there is no keyboard event using CSS to block the INPUT box absolutely above the element that needs to be bound to the keyboard event and set the input box to transparent, The input box is binding the elements that originally binding the keyboard event to achieve the effect;

Test.Vue

  
CSS:
Div.Container {POSITION: Relative;}. Item {position: absolute; top: 0; Left: 0; Width: 100px; height: 100px; border: 1px solid #ccc; .opa {opacity: 0; z-index: 5;} span {position: absolute; top: 5px; Right: 5px; z-index: 10;}

JS:
  Methods: {deletediv () {Alert ("delete");}}  

If it is not a focus, you can write a custom instruction to automatically obtain the focus, Automatic acquisition of focus custom instructions See me another article

Click to enter
  Vuejs 2.0 keyboard event detailed  

Window.onLoad = function () {var VM = new Vue ({EL: ‘# Box’, methods: {show : function (ev) {if (ev.keycode == 13) {alert (‘you press Enter “);}}},}});}

       When pressing the keyboard, execute the SHOW method, and then perform the corresponding service.   The effects of the two INPUTs are the same if An 13 is the button Enter will do pop-up! !  @ Keyup.13 Enter   @ Keyup.Enter Enter   @ Keyup.Eft Left button 
@ Keyup.right Right button
@ Keyup.upUpload @ Keyup.down down key
@ Keyup.delete Delete key
The above instance explanation to the VUE keyboard carriage return event is Xiaobian sharing to everyone All of the content, I hope I can give you a reference, I also hope that you will support Tumi Clouds.

© Copyright Notice
THE END
Just support it if you like
like0
share
comment Grab the couch

Please log in to comment